From 338bd1ed1e392851caa095baf5e2893f9bed24c2 Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Wed, 30 Aug 2023 14:12:41 +0300 Subject: [PATCH 01/66] switch to react functions initial commit --- .../igr-es6/projects/_base/files/package.json | 2 +- .../_base/files/src/views/home/index.js | 41 ++++++-------- .../igr-es6/projects/top-nav/files/src/App.js | 56 +++++++++---------- .../src/components/navigation-header/index.js | 48 +++++++--------- 4 files changed, 65 insertions(+), 82 deletions(-) diff --git a/packages/cli/templates/react/igr-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-es6/projects/_base/files/package.json index d16f609d8..367305c38 100644 --- a/packages/cli/templates/react/igr-es6/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-es6/projects/_base/files/package.json @@ -8,7 +8,7 @@ "react-app-polyfill": "^0.2.0", "react-dom": "^16.8.2", "react-router-dom": "^4.3.1", - "react-scripts": "2.1.5" + "react-scripts": "^5.0.1" }, "devDependencies": { "igniteui-cli": "~$(cliVersion)", diff --git a/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js b/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js index 326cb03ae..814025fd1 100644 --- a/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js +++ b/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js @@ -1,27 +1,22 @@ -import React, { Component } from 'react'; +import React from 'react'; import logo from './logo.svg'; import styles from './style.css'; -export default class Home extends Component { - state = { - } - - render () { - return ( -
- logo -

- Welcome to Ignite UI for React! -

- - Learn More - -
- ) - } +export default function Home() { + return ( +
+ logo +

+ Welcome to Ignite UI for React! +

+ + Learn More + +
+ ) } diff --git a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js index c120a8c9d..2e575a27a 100644 --- a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js +++ b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js @@ -1,36 +1,32 @@ -import React, { Component } from "react"; +import React from "react"; import { Route, BrowserRouter as Router, Switch } from "react-router-dom"; import asyncComponent from "./hoc/asyncComponent"; import NavigationHeader from "./components/navigation-header/index"; import routes from "./routes.json"; import "./App.css"; -class App extends Component { - name = "$(name)"; - render() { - return ( - -
-
{this.name}
- -
- - {routes.map((route, i) => ( - - import("" + route.componentPath) - )} - /> - ))} - -
-
- - ); - } -} - -export default App; +export default function App() { + const name = "$(name)"; + return ( + +
+
{name}
+ +
+ + {routes.map((route, i) => ( + + import("" + route.componentPath) + )} + /> + ))} + +
+
+ + ); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js index f951ab181..4eecfd6d4 100644 --- a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js +++ b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js @@ -1,37 +1,29 @@ -import React, { Component } from 'react'; +import React, { useState, useEffect } from 'react'; import { NavLink } from 'react-router-dom'; -export default class NavigationHeader extends Component { - state = { - activeItem: null - } +export default function NavigationHeader({ routes }) { + const [state, setState] = useState({ activeItem: null }); - handleClick(index) { - this.setState({ - activeItem: index - }) + function handleClick(index) { + setState({ activeItem: index }); } - componentWillMount() { + useEffect(() => { let currentRoute = window.location.href.split(window.location.origin)[1]; if (!currentRoute) { currentRoute = '/' } - const activeItem = this.props.routes.findIndex((route) => route.path === currentRoute); - this.setState({ - activeItem - }); - } - - render() { - return ( - - ) - } -} \ No newline at end of file + const activeItem = routes.findIndex((route) => route.path === currentRoute); + setState({ activeItem }); + }, [routes]); + + return ( + + ) +} \ No newline at end of file From ab678d1e8dd784b4697203a72f271dc513bf627c Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Wed, 6 Sep 2023 22:02:06 +0300 Subject: [PATCH 02/66] fix(igr-es6): switch to functions in all views --- .../default/files/src/views/__path__/index.js | 101 ++++++++-------- .../default/files/src/views/__path__/index.js | 54 ++++----- .../default/files/src/views/__path__/index.js | 51 +++----- .../default/files/src/views/__path__/index.js | 58 +++++----- .../basic/files/src/views/__path__/index.js | 37 +++--- .../default/files/src/views/__path__/index.js | 108 +++++++++-------- .../default/files/src/views/__path__/index.js | 103 +++++++---------- .../default/files/src/views/__path__/index.js | 109 +++++++++--------- 8 files changed, 275 insertions(+), 346 deletions(-) diff --git a/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js index e7dcfcb97..3b7965210 100644 --- a/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React from 'react'; import { IgrBulletGraphModule } from 'igniteui-react-gauges'; import { IgrBulletGraph } from 'igniteui-react-gauges'; import style from './style.css'; @@ -6,57 +6,52 @@ import style from './style.css'; IgrBulletGraphModule.register(); -export default class $(ClassName) extends Component { - title = 'Bullet Graph' - state = { - data: [] - }; +export default function $(ClassName)() { + const title = 'Bullet Graph'; - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) - } + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js index b83030006..04cc56d3a 100644 --- a/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { useEffect, useState } from 'react'; import { IgrCategoryChartModule } from 'igniteui-react-charts'; import { IgrCategoryChart } from 'igniteui-react-charts'; import style from './style.css'; @@ -13,33 +13,29 @@ var data = [ { 'CountryName': 'Brazil', 'Pop1995': 161, 'Pop2005': 186, 'Pop2015': 204, 'Pop2025': 218 } ]; -export default class $(ClassName) extends Component { - title = 'Category Chart' - state = { - data: [] - } +export default class $(ClassName)() { + const title = 'Category Chart'; + const [chartData, setChartData] = useState([]); + + useEffect(() => { + setChartData(data); + }, []); - componentDidMount() { - this.setState({ data }); - } - - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
- - -
-
- ) - } + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js index 42e81759d..8f68386f8 100644 --- a/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { IgrDoughnutChartModule } from 'igniteui-react-charts'; import { IgrDoughnutChart } from 'igniteui-react-charts'; import { IgrRingSeriesModule } from 'igniteui-react-charts'; @@ -22,41 +22,20 @@ const data = [ { MarketShare: 10, Company: "Other", }, ]; -export default class $(ClassName) extends Component { - title = 'Doughnut Chart' - data = []; +export default function $(ClassName)() { + const title = 'Doughnut Chart'; + const [chartData, setChartData] = useState([]); + let legendRef = useRef(); + let chartRef = useRef(); - chart = null; - legend = null; - - onChartRef(chart) { - this.chart = chart; - if (this.legend) { - this.chart.actualSeries[0].legend = this.legend; - } - } - - onLegendRef(legend) { - this.legend = legend; - if (this.chart) { - this.chart.actualSeries[0].legend = this.legend; - } - } - - state = { - data: [] - }; - - componentWillMount() { - this.setState({ data }); - this.onChartRef = this.onChartRef.bind(this); - this.onLegendRef = this.onLegendRef.bind(this); - } + useEffect(() => { + setChartData(data); + }, []); render() { return (
-

{this.title}

+

{title}

Read more on the  @@ -65,17 +44,19 @@ export default class $(ClassName) extends Component {
- +
- + valueMemberPath="MarketShare" + legend={legendRef.current} + />
diff --git a/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js index 6865f390f..8d0462be7 100644 --- a/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react' +import React, { useEffect, useState } from 'react' import { IgrFinancialChartModule } from 'igniteui-react-charts'; import { IgrFinancialChart } from 'igniteui-react-charts'; import style from './style.css'; @@ -20,36 +20,30 @@ const data = [ ]; -export default class $(ClassName) extends Component { - title = 'Financial Chart'; - state = { - data: [] - } +export default function $(ClassName)() { + const title = 'Financial Chart'; + const [chartData, setChartData] = useState([]); + + useEffect(() => { + setChartData(data); + }, []); - componentWillMount() { - this.setState({ - data - }); - } - - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
- - -
-
- ) - } + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js index 0d9b7559f..c5660274c 100644 --- a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React from 'react'; import style from './style.css'; import { IgrDataGridModule } from 'igniteui-react-grids'; import { IgrDataGrid } from 'igniteui-react-grids'; @@ -10,28 +10,24 @@ import data from './data'; IgrDataGridModule.register(); -export default class $(ClassName) extends Component { - title = 'Grid'; - state = { - } +export default function $(ClassName)() { + const title = 'Grid'; - render() { - this.data = data; - return ( + return ( +
+

{title}

-

{this.title}

-
- Read more on the  - - official documentation page - -
-
+ Read more on the  + + official documentation page + +
+
+ dataSource={data}> @@ -44,10 +40,9 @@ export default class $(ClassName) extends Component { height="100%" width="100%" autoGenerateColumns="true" - dataSource={this.data} /> -
+ dataSource={data} />
- ) - } +
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js index 4af8aebbf..6d05a8182 100644 --- a/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js @@ -1,62 +1,60 @@ -import React, { Component } from 'react'; +import React from 'react'; import style from './style.css'; import { IgrLinearGaugeModule } from 'igniteui-react-gauges'; import { IgrLinearGauge } from 'igniteui-react-gauges'; IgrLinearGaugeModule.register(); -export default class $(ClassName) extends Component { - title = 'Linear Gauge'; - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) - } +export default function $(ClassName)() { + const title = 'Linear Gauge'; + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js index 67ac8b663..474a9202c 100644 --- a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { IgrPieChartModule } from 'igniteui-react-charts'; import { IgrPieChart } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; @@ -17,67 +17,42 @@ const data = [ { MarketShare: 10, Company: "Other", }, ]; -export default class $(ClassName) extends Component { - title = 'Pie Chart'; - state = { - data: [] - }; - - legend = null; - chart = null; - - onLegendRef(legend) { - this.legend = legend; - if (this.chart) { - this.chart.legend = this.legend; - } - } - - onChartRef(chart) { - this.chart = chart; - if (this.chart) { - this.chart.legend = this.legend; - } - } - - componentWillMount() { - this.setState({ - data - }); - this.onLegendRef = this.onLegendRef.bind(this); - this.onChartRef = this.onChartRef.bind(this); - } - - handleClick() { - debugger; - } - - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
-
- -
-
- - -
-
-
- ) - } +export default function $(ClassName)() { + const title = 'Pie Chart'; + const [chartData, setChartData] = useState([]); + let legendRef = useRef(); + let chartRef = useRef(); + + useEffect(() => { + setChartData(data); + }, []); + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ +
+
+ + +
+
+
+ ) } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js index b3ba47b90..1aacee12f 100644 --- a/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React from 'react'; import style from './style.css'; import { IgrRadialGaugeModule } from 'igniteui-react-gauges'; import { IgrRadialGauge } from 'igniteui-react-gauges'; @@ -6,61 +6,56 @@ import { IgrRadialGauge } from 'igniteui-react-gauges'; IgrRadialGaugeModule.register(); -export default class $(ClassName) extends Component { - title = 'Radial Gauge' - state = { - data: [] - }; +export default function $(ClassName)() { + const title = 'Radial Gauge'; - render() { - return ( -
-

{this.title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) - } + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) } \ No newline at end of file From e859097cb854d4fcbaddce880a63806f6a2b20bb Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 13 Sep 2023 15:37:00 +0300 Subject: [PATCH 03/66] feat(igr-es6): add igr-ts-es6 proj type --- .../lib/templates/IgniteUIForReactTemplate.ts | 2 +- .../files/src/views/__path__/index.tsx | 57 ++++++++ .../files/src/views/__path__/style.css | 12 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../igr-ts-es6/bullet-graph/default/index.ts | 16 +++ .../react/igr-ts-es6/bullet-graph/index.ts | 15 ++ .../files/src/views/__path__/index.tsx | 41 ++++++ .../files/src/views/__path__/style.css | 9 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../category-chart/default/index.ts | 17 +++ .../react/igr-ts-es6/category-chart/index.ts | 16 +++ .../files/src/views/__path__/index.tsx | 66 +++++++++ .../files/src/views/__path__/style.css | 9 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../doughnut-chart/default/index.ts | 16 +++ .../react/igr-ts-es6/doughnut-chart/index.ts | 15 ++ .../files/src/views/__path__/index.tsx | 49 +++++++ .../files/src/views/__path__/style.css | 10 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../financial-chart/default/index.ts | 18 +++ .../react/igr-ts-es6/financial-chart/index.ts | 15 ++ .../basic/files/src/views/__path__/data.tsx | 46 ++++++ .../basic/files/src/views/__path__/index.tsx | 48 +++++++ .../basic/files/src/views/__path__/style.css | 17 +++ .../basic/files/src/views/__path__/test.tsx | 9 ++ .../react/igr-ts-es6/grid/basic/index.ts | 24 ++++ .../templates/react/igr-ts-es6/grid/index.ts | 14 ++ .../cli/templates/react/igr-ts-es6/index.ts | 17 +++ .../files/src/views/__path__/index.tsx | 60 ++++++++ .../files/src/views/__path__/style.css | 12 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../igr-ts-es6/linear-gauge/default/index.ts | 16 +++ .../react/igr-ts-es6/linear-gauge/index.ts | 15 ++ .../files/src/views/__path__/index.tsx | 58 ++++++++ .../files/src/views/__path__/style.css | 9 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../igr-ts-es6/pie-chart/default/index.ts | 16 +++ .../react/igr-ts-es6/pie-chart/index.ts | 14 ++ .../igr-ts-es6/projects/_base/files/README.md | 48 +++++++ .../projects/_base/files/__dot__editorconfig | 3 + .../projects/_base/files/__dot__env | 1 + .../projects/_base/files/__dot__eslintrc.cjs | 18 +++ .../projects/_base/files/__dot__gitignore | 23 +++ .../projects/_base/files/ignite-ui-cli.json | 16 +++ .../projects/_base/files/index.html | 42 ++++++ .../projects/_base/files/package.json | 41 ++++++ .../projects/_base/files/public/favicon.ico | Bin 0 -> 3870 bytes .../projects/_base/files/public/manifest.json | 15 ++ .../projects/_base/files/src/App.test.tsx | 9 ++ .../_base/files/src/hoc/asyncComponent.tsx | 50 +++++++ .../projects/_base/files/src/index.css | 14 ++ .../projects/_base/files/src/main.tsx | 23 +++ .../projects/_base/files/src/routes.json | 7 + .../_base/files/src/serviceWorker.tsx | 135 ++++++++++++++++++ .../_base/files/src/views/home/index.tsx | 22 +++ .../_base/files/src/views/home/logo.svg | 7 + .../_base/files/src/views/home/style.css | 28 ++++ .../projects/_base/files/src/vite-env.d.ts | 1 + .../projects/_base/files/tsconfig.json | 25 ++++ .../projects/_base/files/tsconfig.node.json | 10 ++ .../projects/_base/files/vite.config.ts | 7 + .../react/igr-ts-es6/projects/_base/index.ts | 47 ++++++ .../projects/top-nav/files/src/App.css | 59 ++++++++ .../projects/top-nav/files/src/App.tsx | 32 +++++ .../components/navigation-header/index.tsx | 29 ++++ .../projects/top-nav/files/src/setupTests.tsx | 4 + .../igr-ts-es6/projects/top-nav/index.ts | 18 +++ .../files/src/views/__path__/index.tsx | 61 ++++++++ .../files/src/views/__path__/style.css | 12 ++ .../default/files/src/views/__path__/test.tsx | 9 ++ .../igr-ts-es6/radial-gauge/default/index.ts | 17 +++ .../react/igr-ts-es6/radial-gauge/index.ts | 16 +++ packages/cli/templates/react/index.ts | 1 + packages/core/util/Util.ts | 2 +- 74 files changed, 1662 insertions(+), 2 deletions(-) create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/favicon.ico create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index e60846e8a..43eec69ac 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -12,7 +12,7 @@ export class IgniteUIForReactTemplate implements Template { public description: string; public dependencies: string[] = []; public framework: string = "react"; - public projectType = "igr-es6"; + public projectType = "igr-ts-es6"; // TEMP public hasExtraConfiguration: boolean = false; public packages = []; public delimiters = defaultDelimiters; diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..3b7965210 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx @@ -0,0 +1,57 @@ +import React from 'react'; +import { IgrBulletGraphModule } from 'igniteui-react-gauges'; +import { IgrBulletGraph } from 'igniteui-react-gauges'; +import style from './style.css'; + +IgrBulletGraphModule.register(); + + +export default function $(ClassName)() { + const title = 'Bullet Graph'; + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..1040e7ad7 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css @@ -0,0 +1,12 @@ +:local(.container) { + padding-top: 24px; + display: flex; + flex-flow: row; + justify-content: space-around; +} +:local(.title) { + color: rgb(0, 153, 255); +} +:local(.graph) { + width: 50%; +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts new file mode 100644 index 000000000..b56f4caf9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts @@ -0,0 +1,16 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsBulletGraphTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Bullet Graph"]; + this.controlGroup = "Gauges"; + this.listInComponentTemplates = true; + this.id = "bullet-graph"; + this.projectType = "igr-ts-es6"; + this.name = "Bullet Graph"; + this.description = `allows for a linear and concise view of measures compared against a scale.`; + this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsBulletGraphTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts b/packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts new file mode 100644 index 000000000..21fd16de6 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts @@ -0,0 +1,15 @@ + +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsBulletGraphComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Bullet Graph"; + this.group = "Gauges"; + this.description = `allows for a linear and concise view of measures compared against a scale.`; + } +} +module.exports = new IgrTsBulletGraphComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..04cc56d3a --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx @@ -0,0 +1,41 @@ +import React, { useEffect, useState } from 'react'; +import { IgrCategoryChartModule } from 'igniteui-react-charts'; +import { IgrCategoryChart } from 'igniteui-react-charts'; +import style from './style.css'; + +IgrCategoryChartModule.register(); + +var data = [ + { 'CountryName': 'China', 'Pop1995': 1216, 'Pop2005': 1297, 'Pop2015': 1361, 'Pop2025': 1394 }, + { 'CountryName': 'India', 'Pop1995': 920, 'Pop2005': 1090, 'Pop2015': 1251, 'Pop2025': 1396 }, + { 'CountryName': 'United States', 'Pop1995': 266, 'Pop2005': 295, 'Pop2015': 322, 'Pop2025': 351 }, + { 'CountryName': 'Indonesia', 'Pop1995': 197, 'Pop2005': 229, 'Pop2015': 256, 'Pop2025': 277 }, + { 'CountryName': 'Brazil', 'Pop1995': 161, 'Pop2005': 186, 'Pop2015': 204, 'Pop2025': 218 } +]; + +export default class $(ClassName)() { + const title = 'Category Chart'; + const [chartData, setChartData] = useState([]); + + useEffect(() => { + setChartData(data); + }, []); + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..b8c09ee23 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css @@ -0,0 +1,9 @@ +:local(.container) { + padding-top: 24px; + display: flex; + flex-flow: row; + justify-content: center; +} +:local(.title) { + color: rgb(0, 153, 255); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts b/packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts new file mode 100644 index 000000000..1097fae47 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts @@ -0,0 +1,17 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsCategoryChartTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Category Chart"]; + this.controlGroup = "Charts"; + this.listInComponentTemplates = true; + this.id = "category-chart"; + this.projectType = "igr-ts-es6"; + this.name = "Category Chart"; + this.description = `makes visualizing category data easy. Simplifies the complexities + of the data visualization domain into manageable API`; + this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsCategoryChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/index.ts b/packages/cli/templates/react/igr-ts-es6/category-chart/index.ts new file mode 100644 index 000000000..d2ba5ea08 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/index.ts @@ -0,0 +1,16 @@ + +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsCategoryChartComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Category Chart"; + this.group = "Charts"; + this.description = `makes visualizing category data easy. Simplifies the complexities + of the data visualization domain into manageable API`; + } +} +module.exports = new IgrTsCategoryChartComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..8f68386f8 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx @@ -0,0 +1,66 @@ +import React, { useEffect, useRef, useState } from 'react'; +import { IgrDoughnutChartModule } from 'igniteui-react-charts'; +import { IgrDoughnutChart } from 'igniteui-react-charts'; +import { IgrRingSeriesModule } from 'igniteui-react-charts'; +import { IgrRingSeries } from 'igniteui-react-charts'; +import { IgrItemLegendModule } from 'igniteui-react-charts'; +import { IgrItemLegend } from 'igniteui-react-charts'; + +import style from './style.css'; + +IgrItemLegendModule.register(); + +IgrDoughnutChartModule.register(); +IgrRingSeriesModule.register(); + + +const data = [ + { MarketShare: 30, Company: "Google", }, + { MarketShare: 15, Company: "Microsoft", }, + { MarketShare: 30, Company: "Apple", }, + { MarketShare: 15, Company: "Samsung", }, + { MarketShare: 10, Company: "Other", }, +]; + +export default function $(ClassName)() { + const title = 'Doughnut Chart'; + const [chartData, setChartData] = useState([]); + let legendRef = useRef(); + let chartRef = useRef(); + + useEffect(() => { + setChartData(data); + }, []); + + render() { + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ +
+
+ + + +
+
+
+ ) + } +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..bd4482f69 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css @@ -0,0 +1,9 @@ +:local(.container) { + display: flex; + flex-flow: row; + justify-content: center; + padding-top: 24px; +} +:local(.title) { + color: rgb(0, 153, 255); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts new file mode 100644 index 000000000..7eec3d33f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts @@ -0,0 +1,16 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsDoughnutChartTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Doughnut Chart"]; + this.controlGroup = "Charts"; + this.listInComponentTemplates = true; + this.id = "doughnut-chart"; + this.projectType = "igr-ts-es6"; + this.name = "Doughnut Chart"; + this.description = `proportionally illustrate the occurrences of variables.`; + this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsDoughnutChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts new file mode 100644 index 000000000..51143d9c2 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts @@ -0,0 +1,15 @@ + +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsDoughnutChartComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Doughnut Chart"; + this.group = "Charts"; + this.description = `proportionally illustrate the occurrences of variables.`; + } +} +module.exports = new IgrTsDoughnutChartComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..8d0462be7 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx @@ -0,0 +1,49 @@ +import React, { useEffect, useState } from 'react' +import { IgrFinancialChartModule } from 'igniteui-react-charts'; +import { IgrFinancialChart } from 'igniteui-react-charts'; +import style from './style.css'; + +IgrFinancialChartModule.register(); + +const data = [ + { time: new Date(2013, 1, 1), open: 268.93, high: 268.93, low: 262.80, close: 265.00, volume: 6118146 }, + { time: new Date(2013, 1, 4), open: 262.78, high: 264.68, low: 259.07, close: 259.98, volume: 3723793 }, + { time: new Date(2013, 1, 5), open: 262.00, high: 268.03, low: 261.46, close: 266.89, volume: 4013780 }, + { time: new Date(2013, 1, 6), open: 265.16, high: 266.89, low: 261.11, close: 262.22, volume: 2772204 }, + { time: new Date(2013, 1, 7), open: 264.10, high: 264.10, low: 255.11, close: 260.23, volume: 3977065 }, + { time: new Date(2013, 1, 8), open: 261.40, high: 265.25, low: 260.56, close: 261.95, volume: 3879628 }, + { time: new Date(2013, 1, 11), open: 263.20, high: 263.25, low: 256.60, close: 257.21, volume: 3407457 }, + { time: new Date(2013, 1, 12), open: 259.19, high: 260.16, low: 257.00, close: 258.70, volume: 2944730 }, + { time: new Date(2013, 1, 13), open: 261.53, high: 269.96, low: 260.30, close: 269.47, volume: 5295786 }, + { time: new Date(2013, 1, 14), open: 267.37, high: 270.65, low: 265.40, close: 269.24, volume: 3464080 }, + { time: new Date(2013, 1, 15), open: 267.63, high: 268.92, low: 263.11, close: 265.09, volume: 3981233 } +]; + + +export default function $(ClassName)() { + const title = 'Financial Chart'; + const [chartData, setChartData] = useState([]); + + useEffect(() => { + setChartData(data); + }, []); + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..9aaa77850 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css @@ -0,0 +1,10 @@ +:local(.container) { + padding-top: 24px; + display: flex; + flex-flow: row; + justify-content: center; + text-align: left; +} +:local(.title) { + color: rgb(0, 153, 255); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts new file mode 100644 index 000000000..5c129bf87 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts @@ -0,0 +1,18 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsFinancialChartTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Financial Chart"]; + this.controlGroup = "Charts"; + // set to true once bug with chart destoy is fixed + this.listInComponentTemplates = false; + this.id = "financial-chart"; + this.projectType = "igr-ts-es6"; + this.name = "Financial Chart"; + this.description = `charting component that makes it easy to visualize financial data by + using a simple and intuitive API.`; + this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsFinancialChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts b/packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts new file mode 100644 index 000000000..3709e026a --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts @@ -0,0 +1,15 @@ +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsFinancialChartComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Financial Chart"; + this.group = "Charts"; + this.description = `charting component that makes it easy to visualize financial data by + using a simple and intuitive API.`; + } +} +module.exports = new IgrTsFinancialChartComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx new file mode 100644 index 000000000..06ba27b28 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx @@ -0,0 +1,46 @@ +export default [{ + Discontinued: false, + OrderDate: new Date('2012-02-12'), + ProductID: 1, + ProductName: 'Chai', + QuantityPerUnit: '10 boxes x 20 bags', + ReorderLevel: 10, + UnitPrice: 18.0000, + UnitsInStock: 39 +}, { + Discontinued: false, + OrderDate: new Date('2003-03-17'), + ProductID: 2, + ProductName: 'Chang', + QuantityPerUnit: '24 - 12 oz bottles', + ReorderLevel: 25, + UnitPrice: 19.0000, + UnitsInStock: 17 +}, { + Discontinued: false, + OrderDate: new Date('2006-03-17'), + ProductID: 3, + ProductName: 'Aniseed Syrup', + QuantityPerUnit: '12 - 550 ml bottles', + ReorderLevel: 25, + UnitPrice: 10.0000, + UnitsInStock: 13 +}, { + Discontinued: false, + OrderDate: new Date('2016-03-17'), + ProductID: 4, + ProductName: 'Chef Antons Cajun Seasoning', + QuantityPerUnit: '48 - 6 oz jars', + ReorderLevel: 0, + UnitPrice: 22.0000, + UnitsInStock: 53 +}, { + Discontinued: true, + OrderDate: new Date('2011-11-11'), + ProductID: 5, + ProductName: 'Chef Antons Gumbo Mix', + QuantityPerUnit: '36 boxes', + ReorderLevel: 0, + UnitPrice: 21.3500, + UnitsInStock: 0 +}]; diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..c5660274c --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx @@ -0,0 +1,48 @@ +import React from 'react'; +import style from './style.css'; +import { IgrDataGridModule } from 'igniteui-react-grids'; +import { IgrDataGrid } from 'igniteui-react-grids'; +import { IgrNumericColumn } from 'igniteui-react-grids'; +import { IgrTextColumn } from 'igniteui-react-grids'; +import { IgrDateTimeColumn } from 'igniteui-react-grids'; + +import data from './data'; + +IgrDataGridModule.register(); + +export default function $(ClassName)() { + const title = 'Grid'; + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + + + + + + +
+
+ +
+
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css new file mode 100644 index 000000000..bb0a0030d --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css @@ -0,0 +1,17 @@ +:local(.container) { + padding-top: 24px; + display: flex; + flex-flow: column; + justify-content: center; + align-items: center; +} + +:local(.title) { + color: rgb(0, 153, 255); +} + +:local(.grid) { + width: 80%; + margin-bottom: 24px; + border: 1px solid rgb(0, 153, 255); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts b/packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts new file mode 100644 index 000000000..2e116514f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts @@ -0,0 +1,24 @@ + +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class GridTemplate extends IgniteUIForReactTemplate { + /** + * + */ + constructor() { + super(__dirname); + this.id = "grid"; + this.name = "Grid"; + this.widget = "igGrid"; + this.description = "IgrGrid template for React"; + this.projectType = "igr-ts-es6"; + this.components = ["Grid"]; + this.controlGroup = "Data Grids"; + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-grids@~16.15.0", "igniteui-react-inputs@~16.15.0", + "igniteui-react-layouts@~16.15.0"]; + + this.hasExtraConfiguration = false; + } +} +module.exports = new GridTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/grid/index.ts b/packages/cli/templates/react/igr-ts-es6/grid/index.ts new file mode 100644 index 000000000..ae88539fe --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/index.ts @@ -0,0 +1,14 @@ +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsDataGridComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Data Grid"; + this.group = "Grids & Lists"; + this.description = "pick from grids: basic, sorting, templating."; + } +} +module.exports = new IgrTsDataGridComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/index.ts b/packages/cli/templates/react/igr-ts-es6/index.ts new file mode 100644 index 000000000..4df8d3a97 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/index.ts @@ -0,0 +1,17 @@ +import { BaseProjectLibrary } from "@igniteui/cli-core"; + +class IgrTsReactProjectLibrary extends BaseProjectLibrary { + constructor() { + super(__dirname); + this.name = "Ignite UI for React"; + this.projectType = "igr-ts-es6"; + this.themes = ["default"]; + + // const groups = require("./groups.json"); + // // tslint:disable-next-line:forin + // for (const key in groups) { + // this.groupDescriptions.set(key, groups[key]); + // } + } +} +module.exports = new IgrTsReactProjectLibrary(); diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..6d05a8182 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx @@ -0,0 +1,60 @@ +import React from 'react'; +import style from './style.css'; +import { IgrLinearGaugeModule } from 'igniteui-react-gauges'; +import { IgrLinearGauge } from 'igniteui-react-gauges'; + +IgrLinearGaugeModule.register(); + +export default function $(ClassName)() { + const title = 'Linear Gauge'; + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..31590f1ec --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css @@ -0,0 +1,12 @@ +:local(.container) { + padding-top: 24px; + display: flex; + flex-flow: row; + justify-content: space-around; +} +:local(.title) { + color: rgb(0, 153, 255); +} +:local(.gauge) { + width: 50%; +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts new file mode 100644 index 000000000..fc1c19434 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts @@ -0,0 +1,16 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsLinearGaugeTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Linear Gauge"]; + this.controlGroup = "Gauges"; + this.listInComponentTemplates = true; + this.id = "linear-gauge"; + this.projectType = "igr-ts-es6"; + this.name = "Linear Gauge"; + this.description = `value compared against a scale and one or more ranges.`; + this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsLinearGaugeTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts b/packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts new file mode 100644 index 000000000..f70320e2e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts @@ -0,0 +1,15 @@ + +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsLinearGaugeComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Linear Gauge"; + this.group = "Gauges"; + this.description = `value compared against a scale and one or more ranges.`; + } +} +module.exports = new IgrTsLinearGaugeComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..474a9202c --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx @@ -0,0 +1,58 @@ +import React, { useEffect, useRef, useState } from 'react'; +import { IgrPieChartModule } from 'igniteui-react-charts'; +import { IgrPieChart } from 'igniteui-react-charts'; +import { IgrItemLegend } from 'igniteui-react-charts'; +import { IgrItemLegendModule } from 'igniteui-react-charts'; + +import style from './style.css'; + +IgrPieChartModule.register(); +IgrItemLegendModule.register(); + +const data = [ + { MarketShare: 30, Company: "Google", }, + { MarketShare: 15, Company: "Microsoft", }, + { MarketShare: 30, Company: "Apple", }, + { MarketShare: 15, Company: "Samsung", }, + { MarketShare: 10, Company: "Other", }, +]; + +export default function $(ClassName)() { + const title = 'Pie Chart'; + const [chartData, setChartData] = useState([]); + let legendRef = useRef(); + let chartRef = useRef(); + + useEffect(() => { + setChartData(data); + }, []); + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ +
+
+ + +
+
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..bd4482f69 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css @@ -0,0 +1,9 @@ +:local(.container) { + display: flex; + flex-flow: row; + justify-content: center; + padding-top: 24px; +} +:local(.title) { + color: rgb(0, 153, 255); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..ea320de9e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; +import { shallow } from 'enzyme'; + +it('$(ClassName) renders without crashing', () => { + const wrapperComponent = shallow(<$(ClassName) />); + expect(wrapperComponent).toBeDefined(); + expect(wrapperComponent).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts new file mode 100644 index 000000000..3eb0eb899 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts @@ -0,0 +1,16 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrPieChartTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Pie Chart"]; + this.controlGroup = "Charts"; + this.listInComponentTemplates = true; + this.id = "pie-chart"; + this.projectType = "igr-ts-es6"; + this.name = "Pie Chart"; + this.description = `easily illustate the proportions of data entries`; + this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrPieChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts b/packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts new file mode 100644 index 000000000..c73c306b9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts @@ -0,0 +1,14 @@ +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrTsPieChartComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Pie Chart"; + this.group = "Charts"; + this.description = `easily illustrate the proportions of data entries`; + } +} +module.exports = new IgrTsPieChartComponent(); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md new file mode 100644 index 000000000..8dd09f816 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md @@ -0,0 +1,48 @@ +# $(name) + +This project was generated with [Ignite UI CLI](https://github.com/IgniteUI/igniteui-cli) version $(cliVersion).
+The template builds upon a project bootstrapped with [Create React App](https://github.com/facebook/create-react-app), so all CRA features are available in this project. + +## Development server + +Run `ig start` to build the application, start a web server and open the application in the default browser.
+The default serving port is `http://localhost:3003/`. Default serving port can be configured in `.env` via `PORT` property. + +## Build + +Run `ig build` to build the application into an output directory. + +## Step by step mode + +If you want to get a guided experience through the available options, you can initialize the step by step mode that will help you to create and setup your new application, as well as update project previously created with the Ignite UI CLI. To start the guide, simply run the `ig` command. + +## List templates + +The `ig list` command lists all available templates for this project. + +## Adding components + +Add a new component or template to the project passing component ID and choosing a name. + +`ig add ` + +The ID matches either a component ("grid", "category-chart", etc) or a predefined template. Predefined templates can provide either multiple components or fulfilling a specific use case like "form-validation", "master-detail" and so on. + +## Running unit tests + +Run `ig test` to execute the unit tests. + +## Commands Help + +`ig help` lists the available commands and provides a brief description of what they do. + +## Learn More + +To get more help on the IgniteUI CLI go check out the [IgniteUI CLI Wiki](https://github.com/IgniteUI/igniteui-cli/wiki). + +Learn more about CRA features in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). + +To learn React, check out the [React documentation](https://reactjs.org/). + + + diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig new file mode 100644 index 000000000..0f3bb618c --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig @@ -0,0 +1,3 @@ +[*.js] +indent_style = space +indent_size = 2 diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env new file mode 100644 index 000000000..fe690d592 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env @@ -0,0 +1 @@ +PORT=3003 diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs new file mode 100644 index 000000000..d6c953795 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs @@ -0,0 +1,18 @@ +module.exports = { + root: true, + env: { browser: true, es2020: true }, + extends: [ + 'eslint:recommended', + 'plugin:@typescript-eslint/recommended', + 'plugin:react-hooks/recommended', + ], + ignorePatterns: ['dist', '.eslintrc.cjs'], + parser: '@typescript-eslint/parser', + plugins: ['react-refresh'], + rules: { + 'react-refresh/only-export-components': [ + 'warn', + { allowConstantExport: true }, + ], + }, +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore new file mode 100644 index 000000000..4d29575de --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore @@ -0,0 +1,23 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# testing +/coverage + +# production +/build + +# misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json new file mode 100644 index 000000000..0b5e1920b --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json @@ -0,0 +1,16 @@ +{ + "version": "$(cliVersion)", + "project": { + "defaultPort": 3003, + "framework": "react", + "projectType": "igr-ts-es6", + "projectTemplate": "$(projectTemplate)", + "theme": "$(theme)", + "isBundle": false, + "components": [], + "sourceFiles": [], + "isShowcase": false, + "version": "" + }, + "build": {} +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html new file mode 100644 index 000000000..1c336173c --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html @@ -0,0 +1,42 @@ + + + + + + + + + + + IgniteUI for React + + + +
+ + + + diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json new file mode 100644 index 000000000..c243f3c58 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json @@ -0,0 +1,41 @@ +{ + "name": "$(dash-name)", + "version": "0.1.0", + "private": true, + "type": "module", + "dependencies": { + "igniteui-react-core": "18.2.2-beta.0", + "react": "^18.2.0", + "react-app-polyfill": "^0.2.0", + "react-dom": "^18.2.0", + "react-router-dom": "^4.3.1" + }, + "devDependencies": { + "@types/react": "^18.2.15", + "@types/react-dom": "^18.2.7", + "@vitejs/plugin-react": "^4.0.3", + "@typescript-eslint/eslint-plugin": "^6.2.1", + "@typescript-eslint/parser": "^6.2.1", + "eslint": "^8.46.0", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-refresh": "^0.4.3", + "typescript": "^5.0.2", + "vite": "^4.4.9", + "igniteui-cli": "~$(cliVersion)" + }, + "scripts": { + "start": "vite", + "build": "tsc && vite build", + "preview": "vite preview", + "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0" + }, + "eslintConfig": { + "extends": "react-app" + }, + "browserslist": [ + ">0.2%", + "not dead", + "not ie <= 11", + "not op_mini all" + ] +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/favicon.ico b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..a11777cc471a4344702741ab1c8a588998b1311a GIT binary patch literal 3870 zcma);c{J4h9>;%nil|2-o+rCuEF-(I%-F}ijC~o(k~HKAkr0)!FCj~d>`RtpD?8b; zXOC1OD!V*IsqUwzbMF1)-gEDD=A573Z-&G7^LoAC9|WO7Xc0Cx1g^Zu0u_SjAPB3vGa^W|sj)80f#V0@M_CAZTIO(t--xg= z!sii`1giyH7EKL_+Wi0ab<)&E_0KD!3Rp2^HNB*K2@PHCs4PWSA32*-^7d{9nH2_E zmC{C*N*)(vEF1_aMamw2A{ZH5aIDqiabnFdJ|y0%aS|64E$`s2ccV~3lR!u<){eS` z#^Mx6o(iP1Ix%4dv`t@!&Za-K@mTm#vadc{0aWDV*_%EiGK7qMC_(`exc>-$Gb9~W!w_^{*pYRm~G zBN{nA;cm^w$VWg1O^^<6vY`1XCD|s_zv*g*5&V#wv&s#h$xlUilPe4U@I&UXZbL z0)%9Uj&@yd03n;!7do+bfixH^FeZ-Ema}s;DQX2gY+7g0s(9;`8GyvPY1*vxiF&|w z>!vA~GA<~JUqH}d;DfBSi^IT*#lrzXl$fNpq0_T1tA+`A$1?(gLb?e#0>UELvljtQ zK+*74m0jn&)5yk8mLBv;=@}c{t0ztT<v;Avck$S6D`Z)^c0(jiwKhQsn|LDRY&w(Fmi91I7H6S;b0XM{e zXp0~(T@k_r-!jkLwd1_Vre^v$G4|kh4}=Gi?$AaJ)3I+^m|Zyj#*?Kp@w(lQdJZf4 z#|IJW5z+S^e9@(6hW6N~{pj8|NO*>1)E=%?nNUAkmv~OY&ZV;m-%?pQ_11)hAr0oAwILrlsGawpxx4D43J&K=n+p3WLnlDsQ$b(9+4 z?mO^hmV^F8MV{4Lx>(Q=aHhQ1){0d*(e&s%G=i5rq3;t{JC zmgbn5Nkl)t@fPH$v;af26lyhH!k+#}_&aBK4baYPbZy$5aFx4}ka&qxl z$=Rh$W;U)>-=S-0=?7FH9dUAd2(q#4TCAHky!$^~;Dz^j|8_wuKc*YzfdAht@Q&ror?91Dm!N03=4=O!a)I*0q~p0g$Fm$pmr$ zb;wD;STDIi$@M%y1>p&_>%?UP($15gou_ue1u0!4(%81;qcIW8NyxFEvXpiJ|H4wz z*mFT(qVx1FKufG11hByuX%lPk4t#WZ{>8ka2efjY`~;AL6vWyQKpJun2nRiZYDij$ zP>4jQXPaP$UC$yIVgGa)jDV;F0l^n(V=HMRB5)20V7&r$jmk{UUIe zVjKroK}JAbD>B`2cwNQ&GDLx8{pg`7hbA~grk|W6LgiZ`8y`{Iq0i>t!3p2}MS6S+ zO_ruKyAElt)rdS>CtF7j{&6rP-#c=7evGMt7B6`7HG|-(WL`bDUAjyn+k$mx$CH;q2Dz4x;cPP$hW=`pFfLO)!jaCL@V2+F)So3}vg|%O*^T1j>C2lx zsURO-zIJC$^$g2byVbRIo^w>UxK}74^TqUiRR#7s_X$e)$6iYG1(PcW7un-va-S&u zHk9-6Zn&>T==A)lM^D~bk{&rFzCi35>UR!ZjQkdSiNX*-;l4z9j*7|q`TBl~Au`5& z+c)*8?#-tgUR$Zd%Q3bs96w6k7q@#tUn`5rj+r@_sAVVLqco|6O{ILX&U-&-cbVa3 zY?ngHR@%l{;`ri%H*0EhBWrGjv!LE4db?HEWb5mu*t@{kv|XwK8?npOshmzf=vZA@ zVSN9sL~!sn?r(AK)Q7Jk2(|M67Uy3I{eRy z_l&Y@A>;vjkWN5I2xvFFTLX0i+`{qz7C_@bo`ZUzDugfq4+>a3?1v%)O+YTd6@Ul7 zAfLfm=nhZ`)P~&v90$&UcF+yXm9sq!qCx3^9gzIcO|Y(js^Fj)Rvq>nQAHI92ap=P z10A4@prk+AGWCb`2)dQYFuR$|H6iDE8p}9a?#nV2}LBCoCf(Xi2@szia7#gY>b|l!-U`c}@ zLdhvQjc!BdLJvYvzzzngnw51yRYCqh4}$oRCy-z|v3Hc*d|?^Wj=l~18*E~*cR_kU z{XsxM1i{V*4GujHQ3DBpl2w4FgFR48Nma@HPgnyKoIEY-MqmMeY=I<%oG~l!f<+FN z1ZY^;10j4M4#HYXP zw5eJpA_y(>uLQ~OucgxDLuf}fVs272FaMxhn4xnDGIyLXnw>Xsd^J8XhcWIwIoQ9} z%FoSJTAGW(SRGwJwb=@pY7r$uQRK3Zd~XbxU)ts!4XsJrCycrWSI?e!IqwqIR8+Jh zlRjZ`UO1I!BtJR_2~7AbkbSm%XQqxEPkz6BTGWx8e}nQ=w7bZ|eVP4?*Tb!$(R)iC z9)&%bS*u(lXqzitAN)Oo=&Ytn>%Hzjc<5liuPi>zC_nw;Z0AE3Y$Jao_Q90R-gl~5 z_xAb2J%eArrC1CN4G$}-zVvCqF1;H;abAu6G*+PDHSYFx@Tdbfox*uEd3}BUyYY-l zTfEsOqsi#f9^FoLO;ChK<554qkri&Av~SIM*{fEYRE?vH7pTAOmu2pz3X?Wn*!ROX ztd54huAk&mFBemMooL33RV-*1f0Q3_(7hl$<#*|WF9P!;r;4_+X~k~uKEqdzZ$5Al zV63XN@)j$FN#cCD;ek1R#l zv%pGrhB~KWgoCj%GT?%{@@o(AJGt*PG#l3i>lhmb_twKH^EYvacVY-6bsCl5*^~L0 zonm@lk2UvvTKr2RS%}T>^~EYqdL1q4nD%0n&Xqr^cK^`J5W;lRRB^R-O8b&HENO||mo0xaD+S=I8RTlIfVgqN@SXDr2&-)we--K7w= zJVU8?Z+7k9dy;s;^gDkQa`0nz6N{T?(A&Iz)2!DEecLyRa&FI!id#5Z7B*O2=PsR0 zEvc|8{NS^)!d)MDX(97Xw}m&kEO@5jqRaDZ!+%`wYOI<23q|&js`&o4xvjP7D_xv@ z5hEwpsp{HezI9!~6O{~)lLR@oF7?J7i>1|5a~UuoN=q&6N}EJPV_GD`&M*v8Y`^2j zKII*d_@Fi$+i*YEW+Hbzn{iQk~yP z>7N{S4)r*!NwQ`(qcN#8SRQsNK6>{)X12nbF`*7#ecO7I)Q$uZsV+xS4E7aUn+U(K baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@ literal 0 HcmV?d00001 diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json new file mode 100644 index 000000000..27c95fff2 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json @@ -0,0 +1,15 @@ +{ + "short_name": "$(name)", + "name": "$(name)", + "icons": [ + { + "src": "favicon.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + } + ], + "start_url": ".", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx new file mode 100644 index 000000000..a754b201b --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import App from './App'; + +it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + ReactDOM.unmountComponentAtNode(div); +}); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx new file mode 100644 index 000000000..560f734e4 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx @@ -0,0 +1,50 @@ +import React, {Component} from 'react'; + +// https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html +const makeCancelable = (promise) => { + let hasCanceled_ = false; + + const wrappedPromise = new Promise((resolve, reject) => { + promise.then( + val => hasCanceled_ ? reject({isCanceled: true}) : resolve(val), + error => hasCanceled_ ? reject({isCanceled: true}) : reject(error) + ); + }); + + return { + promise: wrappedPromise, + cancel() { + hasCanceled_ = true; + }, + }; + }; + +/** + * https://medium.com/front-end-weekly/loading-components-asynchronously-in-react-app-with-an-hoc-61ca27c4fda7 + * @param {function} importComponent + */ +const asyncComponent = (importComponent) => { + return class extends Component { + state = { + component: null + } + + componentDidMount() { + this.op = makeCancelable(importComponent()); + this.op.promise.then(cmp => { + this.setState({component: cmp.default}); + }); + } + + componentWillUnmount() { + this.op.cancel(); + } + + render() { + const C = this.state.component; + return C ? : null; + } + } +}; + +export default asyncComponent; \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css new file mode 100644 index 000000000..cee5f348f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css @@ -0,0 +1,14 @@ +body { + margin: 0; + padding: 0; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", + "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", + sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +code { + font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", + monospace; +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx new file mode 100644 index 000000000..d368754b6 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import ReactDOM from 'react-dom/client'; +import './index.css'; +import App from './App'; +import * as serviceWorker from './serviceWorker'; +import 'react-app-polyfill/ie11'; + +/** Required in IE11 for Charts */ +Number.isNaN = Number.isNaN || function(value) { + // eslint-disable-next-line + return value !== value; +} + +ReactDOM.createRoot(document.getElementById('root')).render( + + + +) + +// If you want your app to work offline and load faster, you can change +// unregister() to register() below. Note this comes with some pitfalls. +// Learn more about service workers: http://bit.ly/CRA-PWA +serviceWorker.unregister(); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json new file mode 100644 index 000000000..62ca363d6 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json @@ -0,0 +1,7 @@ +[ + { + "path": "/", + "componentPath": "./views/home", + "text": "Home" + } +] diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx new file mode 100644 index 000000000..2283ff9ce --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx @@ -0,0 +1,135 @@ +// This optional code is used to register a service worker. +// register() is not called by default. + +// This lets the app load faster on subsequent visits in production, and gives +// it offline capabilities. However, it also means that developers (and users) +// will only see deployed updates on subsequent visits to a page, after all the +// existing tabs open on the page have been closed, since previously cached +// resources are updated in the background. + +// To learn more about the benefits of this model and instructions on how to +// opt-in, read http://bit.ly/CRA-PWA + +const isLocalhost = Boolean( + window.location.hostname === 'localhost' || + // [::1] is the IPv6 localhost address. + window.location.hostname === '[::1]' || + // 127.0.0.1/8 is considered localhost for IPv4. + window.location.hostname.match( + /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ + ) +); + +export function register(config) { + if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { + // The URL constructor is available in all browsers that support SW. + const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href); + if (publicUrl.origin !== window.location.origin) { + // Our service worker won't work if PUBLIC_URL is on a different origin + // from what our page is served on. This might happen if a CDN is used to + // serve assets; see https://github.com/facebook/create-react-app/issues/2374 + return; + } + + window.addEventListener('load', () => { + const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; + + if (isLocalhost) { + // This is running on localhost. Let's check if a service worker still exists or not. + checkValidServiceWorker(swUrl, config); + + // Add some additional logging to localhost, pointing developers to the + // service worker/PWA documentation. + navigator.serviceWorker.ready.then(() => { + console.log( + 'This web app is being served cache-first by a service ' + + 'worker. To learn more, visit http://bit.ly/CRA-PWA' + ); + }); + } else { + // Is not localhost. Just register service worker + registerValidSW(swUrl, config); + } + }); + } +} + +function registerValidSW(swUrl, config) { + navigator.serviceWorker + .register(swUrl) + .then(registration => { + registration.onupdatefound = () => { + const installingWorker = registration.installing; + if (installingWorker == null) { + return; + } + installingWorker.onstatechange = () => { + if (installingWorker.state === 'installed') { + if (navigator.serviceWorker.controller) { + // At this point, the updated precached content has been fetched, + // but the previous service worker will still serve the older + // content until all client tabs are closed. + console.log( + 'New content is available and will be used when all ' + + 'tabs for this page are closed. See http://bit.ly/CRA-PWA.' + ); + + // Execute callback + if (config && config.onUpdate) { + config.onUpdate(registration); + } + } else { + // At this point, everything has been precached. + // It's the perfect time to display a + // "Content is cached for offline use." message. + console.log('Content is cached for offline use.'); + + // Execute callback + if (config && config.onSuccess) { + config.onSuccess(registration); + } + } + } + }; + }; + }) + .catch(error => { + console.error('Error during service worker registration:', error); + }); +} + +function checkValidServiceWorker(swUrl, config) { + // Check if the service worker can be found. If it can't reload the page. + fetch(swUrl) + .then(response => { + // Ensure service worker exists, and that we really are getting a JS file. + const contentType = response.headers.get('content-type'); + if ( + response.status === 404 || + (contentType != null && contentType.indexOf('javascript') === -1) + ) { + // No service worker found. Probably a different app. Reload the page. + navigator.serviceWorker.ready.then(registration => { + registration.unregister().then(() => { + window.location.reload(); + }); + }); + } else { + // Service worker found. Proceed as normal. + registerValidSW(swUrl, config); + } + }) + .catch(() => { + console.log( + 'No internet connection found. App is running in offline mode.' + ); + }); +} + +export function unregister() { + if ('serviceWorker' in navigator) { + navigator.serviceWorker.ready.then(registration => { + registration.unregister(); + }); + } +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx new file mode 100644 index 000000000..814025fd1 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import logo from './logo.svg'; +import styles from './style.css'; + +export default function Home() { + return ( +
+ logo +

+ Welcome to Ignite UI for React! +

+ + Learn More + +
+ ) +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg new file mode 100644 index 000000000..6b60c1042 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css new file mode 100644 index 000000000..304d9b24e --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css @@ -0,0 +1,28 @@ +/* CSS Modules https://medium.com/@pioul/modular-css-with-react-61638ae9ea3e */ +:local(.logo) { + animation: App-logo-spin infinite 20s linear; + height: 40vmin; +} + +:local(.header) { + padding-top: 5em; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: #333; +} + +:local(.link) { + color: #61dafb; +} + +@keyframes App-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts new file mode 100644 index 000000000..11f02fe2a --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json new file mode 100644 index 000000000..026bb22be --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json @@ -0,0 +1,25 @@ +{ + "compilerOptions": { + "target": "ES2020", + "useDefineForClassFields": true, + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "strict": false, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["src", "vite.config.ts"], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json new file mode 100644 index 000000000..42872c59f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json @@ -0,0 +1,10 @@ +{ + "compilerOptions": { + "composite": true, + "skipLibCheck": true, + "module": "ESNext", + "moduleResolution": "bundler", + "allowSyntheticDefaultImports": true + }, + "include": ["vite.config.ts"] +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts new file mode 100644 index 000000000..5a33944a9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [react()], +}) diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts new file mode 100644 index 000000000..62d9a7cac --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts @@ -0,0 +1,47 @@ +import { ControlExtraConfiguration, defaultDelimiters, ProjectTemplate, Util } from "@igniteui/cli-core"; +import * as path from "path"; + +export class BaseIgrTsProject implements ProjectTemplate { + public id: string = "base"; + public name = "base"; + public description = "Ignite UI CLI project for React"; + public framework: string = "react"; + public projectType: string = "tsx"; + public dependencies: string[]; + public hasExtraConfiguration: boolean = false; + public delimiters = defaultDelimiters; + + public get templatePaths(): string[] { + return [path.join(__dirname, "files")]; + } + + public generateConfig(name: string, theme: string, ...options: any[]): {[key: string]: any} { + return this.getVariablesConfig(name, theme); + } + + public installModules(): void { + throw new Error("Method not implemented."); + } + public async upgradeIgniteUIPackages(projectPath: string, packagePath: string): Promise { + throw new Error("Method not implemented."); + } + public getExtraConfiguration(): ControlExtraConfiguration[] { + throw new Error("Method not implemented."); + } + public setExtraConfiguration(extraConfigKeys: {}) { + throw new Error("Method not implemented."); + } + + protected getVariablesConfig(name: string, theme: string) { + return { + name, + theme, + "cliVersion": Util.version(), + "dash-name": Util.lowerDashed(name), + "description": this.description, + "dot": ".", + "path": name, + "projectTemplate": this.id + }; + } +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css new file mode 100644 index 000000000..fd9528478 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css @@ -0,0 +1,59 @@ +.app { + text-align: center; + display: flex; + flex-flow: column; + min-height: 100vh; + } + + .content { + flex: 1 0 auto; + padding: 1em; + } + + /* quick nav menubar */ + nav, .app__name { + background-color: rgb(0, 153, 255); + box-sizing: border-box; + } + .app__name { + font-weight: 600; + font-size: 24px; + line-height: 32px; + padding-left: 24px; + text-align: left; + color: #FFF; + padding-bottom: 8px; + } + + nav ul { + list-style: none; + display: flex; + justify-content: flex-start; + flex-wrap: wrap; + margin: 0; + padding: 0; + } + + nav ul a { + color: #fff; + line-height: 2; + text-decoration: none; + margin: 0 5px; + } + + nav ul a.active { + color: #fff; + font-weight: 600; + } + nav ul li { + margin: 0px 16px; + box-sizing: border-box; + border-bottom: 1px solid transparent; + } + nav ul li.active { + border-bottom: 2px solid #fff; + } + nav ul li:not(.active):hover { + border-bottom: 1px solid #fff; + } + \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx new file mode 100644 index 000000000..2e575a27a --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx @@ -0,0 +1,32 @@ +import React from "react"; +import { Route, BrowserRouter as Router, Switch } from "react-router-dom"; +import asyncComponent from "./hoc/asyncComponent"; +import NavigationHeader from "./components/navigation-header/index"; +import routes from "./routes.json"; +import "./App.css"; + +export default function App() { + const name = "$(name)"; + return ( + +
+
{name}
+ +
+ + {routes.map((route, i) => ( + + import("" + route.componentPath) + )} + /> + ))} + +
+
+ + ); +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx new file mode 100644 index 000000000..4eecfd6d4 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx @@ -0,0 +1,29 @@ +import React, { useState, useEffect } from 'react'; +import { NavLink } from 'react-router-dom'; + +export default function NavigationHeader({ routes }) { + const [state, setState] = useState({ activeItem: null }); + + function handleClick(index) { + setState({ activeItem: index }); + } + + useEffect(() => { + let currentRoute = window.location.href.split(window.location.origin)[1]; + if (!currentRoute) { + currentRoute = '/' + } + const activeItem = routes.findIndex((route) => route.path === currentRoute); + setState({ activeItem }); + }, [routes]); + + return ( + + ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx new file mode 100644 index 000000000..acd71d494 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx @@ -0,0 +1,4 @@ +import Enzyme from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; + +Enzyme.configure({ adapter: new Adapter() }); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts new file mode 100644 index 000000000..2e1a629cb --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts @@ -0,0 +1,18 @@ +import { ProjectTemplate } from "@igniteui/cli-core"; +import * as path from "path"; +import { BaseIgrTsProject } from "../_base"; + +export class TopNavIgrTsProject extends BaseIgrTsProject implements ProjectTemplate { + public id: string = "top-nav"; + public name = "Default top navigation"; + public description = "Project structure with top navigation menu"; + public dependencies: string[] = []; + public framework: string = "react"; + public projectType: string = "igr-ts-es6"; + public hasExtraConfiguration: boolean = false; + + public get templatePaths(): string[] { + return [...super.templatePaths, path.join(__dirname, "files")]; + } +} +export default new TopNavIgrTsProject(); diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx new file mode 100644 index 000000000..1aacee12f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx @@ -0,0 +1,61 @@ +import React from 'react'; +import style from './style.css'; +import { IgrRadialGaugeModule } from 'igniteui-react-gauges'; +import { IgrRadialGauge } from 'igniteui-react-gauges'; + +IgrRadialGaugeModule.register(); + + +export default function $(ClassName)() { + const title = 'Radial Gauge'; + + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css new file mode 100644 index 000000000..8ccb6dae7 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css @@ -0,0 +1,12 @@ +:local(.container) { + display: flex; + flex-flow: row; + justify-content: space-around; +} + +:local(.title) { + color: rgb(0, 153, 255); +} +:local(.gauge) { + width: 50%; +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx new file mode 100644 index 000000000..0acf929af --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import $(ClassName) from './index'; + +it('$(ClassName) renders without crashing', () => { + // const wrapperComponent = shallow(<$(ClassName) />); + // expect(wrapperComponent).toBeDefined(); + // expect(wrapperComponent).toBeTruthy(); + expect(true).toBeTruthy(); +}); diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts new file mode 100644 index 000000000..02f9d42ba --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts @@ -0,0 +1,17 @@ +import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; + +class IgrTsRadialGaugeTemplate extends IgniteUIForReactTemplate { + constructor() { + super(__dirname); + this.components = ["Radial Gauge"]; + this.controlGroup = "Gauges"; + this.listInComponentTemplates = true; + this.id = "radial-gauge"; + this.projectType = "igr-ts-es6"; + this.name = "Radial Gauge"; + this.description = `provides a number of visual elements, like a needle, tick marks, ranges + and labels, in order to create a predefined shape and scale.`; + this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + } +} +module.exports = new IgrTsRadialGaugeTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts b/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts new file mode 100644 index 000000000..ff8c59949 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts @@ -0,0 +1,16 @@ + +import { BaseComponent } from "@igniteui/cli-core"; + +class IgrRadialGaugeComponent extends BaseComponent { + /** + * + */ + constructor() { + super(__dirname); + this.name = "Radial Gauge"; + this.group = "Gauges"; + this.description = `provides a number of visual elements, like a needle, tick marks, ranges + and labels, in order to create a predefined shape and scale.`; + } +} +module.exports = new IgrRadialGaugeComponent(); diff --git a/packages/cli/templates/react/index.ts b/packages/cli/templates/react/index.ts index dda6ab5b2..91c41dc9f 100644 --- a/packages/cli/templates/react/index.ts +++ b/packages/cli/templates/react/index.ts @@ -11,6 +11,7 @@ class ReactFramework implements Framework { this.projectLibraries = []; this.projectLibraries.push(require("./es6") as ProjectLibrary); this.projectLibraries.push(require("./igr-es6") as ProjectLibrary); + this.projectLibraries.push(require("./igr-ts-es6") as ProjectLibrary); } } export = new ReactFramework() as Framework; diff --git a/packages/core/util/Util.ts b/packages/core/util/Util.ts index 9ad81cdc0..73bb2c26e 100644 --- a/packages/core/util/Util.ts +++ b/packages/core/util/Util.ts @@ -399,7 +399,7 @@ export class Util { specificPath = path.join("src", "app", "components"); } else if (framework === "react" && projectType === "es6") { specificPath = path.join("src", "components"); - } else if (framework === "react" && projectType === "igr-es6") { + } else if (framework === "react" && (projectType === "igr-es6" || projectType === "igr-ts-es6")) { specificPath = path.join("src", "views"); } else if (framework === "webcomponents" && projectType === "igc-ts") { specificPath = path.join("src", "app"); From 504fd7b0fc96952833273ba4a987a0a9c2143da2 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 14 Sep 2023 16:12:23 +0300 Subject: [PATCH 04/66] fix(igr-ts-es6): update react router version and style import --- .../bullet-graph/default/files/src/views/__path__/index.tsx | 4 ++-- .../src/views/__path__/{style.css => style.module.css} | 0 .../default/files/src/views/__path__/index.tsx | 6 +++--- .../src/views/__path__/{style.css => style.module.css} | 0 .../default/files/src/views/__path__/index.tsx | 6 +++--- .../src/views/__path__/{style.css => style.module.css} | 0 .../default/files/src/views/__path__/index.tsx | 6 +++--- .../src/views/__path__/{style.css => style.module.css} | 0 .../grid/basic/files/src/views/__path__/index.tsx | 6 +++--- .../src/views/__path__/{style.css => style.module.css} | 0 .../linear-gauge/default/files/src/views/__path__/index.tsx | 4 ++-- .../src/views/__path__/{style.css => style.module.css} | 0 .../pie-chart/default/files/src/views/__path__/index.tsx | 6 +++--- .../src/views/__path__/{style.css => style.module..css} | 0 .../react/igr-ts-es6/projects/_base/files/package.json | 2 +- .../projects/_base/files/src/views/home/index.tsx | 2 +- .../files/src/views/home/{style.css => style.module.css} | 0 17 files changed, 21 insertions(+), 21 deletions(-) rename packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/{style.css => style.module.css} (100%) rename packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/{style.css => style.module..css} (100%) rename packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/{style.css => style.module.css} (100%) diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx index 3b7965210..498e424d3 100644 --- a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IgrBulletGraphModule } from 'igniteui-react-gauges'; import { IgrBulletGraph } from 'igniteui-react-gauges'; -import style from './style.css'; +import style from './style.module.css'; IgrBulletGraphModule.register(); @@ -54,4 +54,4 @@ export default function $(ClassName)() {
) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx index 04cc56d3a..115245b1c 100644 --- a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react'; import { IgrCategoryChartModule } from 'igniteui-react-charts'; import { IgrCategoryChart } from 'igniteui-react-charts'; -import style from './style.css'; +import style from './style.module.css'; IgrCategoryChartModule.register(); @@ -16,7 +16,7 @@ var data = [ export default class $(ClassName)() { const title = 'Category Chart'; const [chartData, setChartData] = useState([]); - + useEffect(() => { setChartData(data); }, []); @@ -38,4 +38,4 @@ export default class $(ClassName)() { ) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx index 8f68386f8..dfe7056e6 100644 --- a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx @@ -6,7 +6,7 @@ import { IgrRingSeries } from 'igniteui-react-charts'; import { IgrItemLegendModule } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; -import style from './style.css'; +import style from './style.module.css'; IgrItemLegendModule.register(); @@ -23,7 +23,7 @@ const data = [ ]; export default function $(ClassName)() { - const title = 'Doughnut Chart'; + const title = 'Doughnut Chart'; const [chartData, setChartData] = useState([]); let legendRef = useRef(); let chartRef = useRef(); @@ -63,4 +63,4 @@ export default function $(ClassName)() { ) } -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx index 8d0462be7..ac4a52f1b 100644 --- a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react' import { IgrFinancialChartModule } from 'igniteui-react-charts'; import { IgrFinancialChart } from 'igniteui-react-charts'; -import style from './style.css'; +import style from './style.module.css'; IgrFinancialChartModule.register(); @@ -23,7 +23,7 @@ const data = [ export default function $(ClassName)() { const title = 'Financial Chart'; const [chartData, setChartData] = useState([]); - + useEffect(() => { setChartData(data); }, []); @@ -46,4 +46,4 @@ export default function $(ClassName)() { ) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx index c5660274c..d06ce39f4 100644 --- a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import style from './style.css'; +import style from './style.module.css'; import { IgrDataGridModule } from 'igniteui-react-grids'; import { IgrDataGrid } from 'igniteui-react-grids'; import { IgrNumericColumn } from 'igniteui-react-grids'; @@ -44,5 +44,5 @@ export default function $(ClassName)() { - ) -} \ No newline at end of file + ) +} diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx index 6d05a8182..69c497c33 100644 --- a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import style from './style.css'; +import style from './style.module.css'; import { IgrLinearGaugeModule } from 'igniteui-react-gauges'; import { IgrLinearGauge } from 'igniteui-react-gauges'; @@ -57,4 +57,4 @@ export default function $(ClassName)() { ) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx index 474a9202c..caa714927 100644 --- a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx @@ -4,7 +4,7 @@ import { IgrPieChart } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; import { IgrItemLegendModule } from 'igniteui-react-charts'; -import style from './style.css'; +import style from './style.module.css'; IgrPieChartModule.register(); IgrItemLegendModule.register(); @@ -22,7 +22,7 @@ export default function $(ClassName)() { const [chartData, setChartData] = useState([]); let legendRef = useRef(); let chartRef = useRef(); - + useEffect(() => { setChartData(data); }, []); @@ -55,4 +55,4 @@ export default function $(ClassName)() { ) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module..css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module..css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json index c243f3c58..91c02635b 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json @@ -8,7 +8,7 @@ "react": "^18.2.0", "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^4.3.1" + "react-router-dom": "5.3.4" }, "devDependencies": { "@types/react": "^18.2.15", diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx index 814025fd1..3424d4e2f 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx @@ -1,6 +1,6 @@ import React from 'react'; import logo from './logo.svg'; -import styles from './style.css'; +import styles from './style.module.css'; export default function Home() { return ( diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.css rename to packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.module.css From 865243cc4e284d8a1e9ddc793fc7668baec5c66e Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 14 Sep 2023 16:13:45 +0300 Subject: [PATCH 05/66] Revert "fix(igr-es6): switch to functions in all views" This reverts commit ab678d1e8dd784b4697203a72f271dc513bf627c. --- .../default/files/src/views/__path__/index.js | 101 ++++++++-------- .../default/files/src/views/__path__/index.js | 54 +++++---- .../default/files/src/views/__path__/index.js | 51 +++++--- .../default/files/src/views/__path__/index.js | 58 +++++----- .../basic/files/src/views/__path__/index.js | 37 +++--- .../default/files/src/views/__path__/index.js | 108 ++++++++--------- .../default/files/src/views/__path__/index.js | 103 ++++++++++------- .../default/files/src/views/__path__/index.js | 109 +++++++++--------- 8 files changed, 346 insertions(+), 275 deletions(-) diff --git a/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js index 3b7965210..e7dcfcb97 100644 --- a/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/bullet-graph/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Component } from 'react'; import { IgrBulletGraphModule } from 'igniteui-react-gauges'; import { IgrBulletGraph } from 'igniteui-react-gauges'; import style from './style.css'; @@ -6,52 +6,57 @@ import style from './style.css'; IgrBulletGraphModule.register(); -export default function $(ClassName)() { - const title = 'Bullet Graph'; +export default class $(ClassName) extends Component { + title = 'Bullet Graph' + state = { + data: [] + }; - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js index 04cc56d3a..b83030006 100644 --- a/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/category-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React, { Component } from 'react'; import { IgrCategoryChartModule } from 'igniteui-react-charts'; import { IgrCategoryChart } from 'igniteui-react-charts'; import style from './style.css'; @@ -13,29 +13,33 @@ var data = [ { 'CountryName': 'Brazil', 'Pop1995': 161, 'Pop2005': 186, 'Pop2015': 204, 'Pop2025': 218 } ]; -export default class $(ClassName)() { - const title = 'Category Chart'; - const [chartData, setChartData] = useState([]); - - useEffect(() => { - setChartData(data); - }, []); +export default class $(ClassName) extends Component { + title = 'Category Chart' + state = { + data: [] + } - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
- - -
-
- ) + componentDidMount() { + this.setState({ data }); + } + + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js index 8f68386f8..42e81759d 100644 --- a/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/doughnut-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from 'react'; +import React, { Component } from 'react'; import { IgrDoughnutChartModule } from 'igniteui-react-charts'; import { IgrDoughnutChart } from 'igniteui-react-charts'; import { IgrRingSeriesModule } from 'igniteui-react-charts'; @@ -22,20 +22,41 @@ const data = [ { MarketShare: 10, Company: "Other", }, ]; -export default function $(ClassName)() { - const title = 'Doughnut Chart'; - const [chartData, setChartData] = useState([]); - let legendRef = useRef(); - let chartRef = useRef(); +export default class $(ClassName) extends Component { + title = 'Doughnut Chart' + data = []; - useEffect(() => { - setChartData(data); - }, []); + chart = null; + legend = null; + + onChartRef(chart) { + this.chart = chart; + if (this.legend) { + this.chart.actualSeries[0].legend = this.legend; + } + } + + onLegendRef(legend) { + this.legend = legend; + if (this.chart) { + this.chart.actualSeries[0].legend = this.legend; + } + } + + state = { + data: [] + }; + + componentWillMount() { + this.setState({ data }); + this.onChartRef = this.onChartRef.bind(this); + this.onLegendRef = this.onLegendRef.bind(this); + } render() { return (
-

{title}

+

{this.title}

Read more on the  @@ -44,19 +65,17 @@ export default function $(ClassName)() {
- +
- + valueMemberPath="MarketShare" />
diff --git a/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js index 8d0462be7..6865f390f 100644 --- a/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/financial-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react' +import React, { Component } from 'react' import { IgrFinancialChartModule } from 'igniteui-react-charts'; import { IgrFinancialChart } from 'igniteui-react-charts'; import style from './style.css'; @@ -20,30 +20,36 @@ const data = [ ]; -export default function $(ClassName)() { - const title = 'Financial Chart'; - const [chartData, setChartData] = useState([]); - - useEffect(() => { - setChartData(data); - }, []); +export default class $(ClassName) extends Component { + title = 'Financial Chart'; + state = { + data: [] + } - return ( -
-

{title}

- -
- - -
-
- ) + componentWillMount() { + this.setState({ + data + }); + } + + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+ + +
+
+ ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js index c5660274c..0d9b7559f 100644 --- a/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/grid/basic/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Component } from 'react'; import style from './style.css'; import { IgrDataGridModule } from 'igniteui-react-grids'; import { IgrDataGrid } from 'igniteui-react-grids'; @@ -10,24 +10,28 @@ import data from './data'; IgrDataGridModule.register(); -export default function $(ClassName)() { - const title = 'Grid'; +export default class $(ClassName) extends Component { + title = 'Grid'; + state = { + } - return ( -
-

{title}

+ render() { + this.data = data; + return (
- Read more on the  - - official documentation page - -
-
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+ dataSource={this.data}> @@ -40,9 +44,10 @@ export default function $(ClassName)() { height="100%" width="100%" autoGenerateColumns="true" - dataSource={data} /> + dataSource={this.data} /> +
-
- ) + ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js index 6d05a8182..4af8aebbf 100644 --- a/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/linear-gauge/default/files/src/views/__path__/index.js @@ -1,60 +1,62 @@ -import React from 'react'; +import React, { Component } from 'react'; import style from './style.css'; import { IgrLinearGaugeModule } from 'igniteui-react-gauges'; import { IgrLinearGauge } from 'igniteui-react-gauges'; IgrLinearGaugeModule.register(); -export default function $(ClassName)() { - const title = 'Linear Gauge'; - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) +export default class $(ClassName) extends Component { + title = 'Linear Gauge'; + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js index 474a9202c..67ac8b663 100644 --- a/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/pie-chart/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from 'react'; +import React, { Component } from 'react'; import { IgrPieChartModule } from 'igniteui-react-charts'; import { IgrPieChart } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; @@ -17,42 +17,67 @@ const data = [ { MarketShare: 10, Company: "Other", }, ]; -export default function $(ClassName)() { - const title = 'Pie Chart'; - const [chartData, setChartData] = useState([]); - let legendRef = useRef(); - let chartRef = useRef(); - - useEffect(() => { - setChartData(data); - }, []); - - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- -
-
- - -
-
-
- ) +export default class $(ClassName) extends Component { + title = 'Pie Chart'; + state = { + data: [] + }; + + legend = null; + chart = null; + + onLegendRef(legend) { + this.legend = legend; + if (this.chart) { + this.chart.legend = this.legend; + } + } + + onChartRef(chart) { + this.chart = chart; + if (this.chart) { + this.chart.legend = this.legend; + } + } + + componentWillMount() { + this.setState({ + data + }); + this.onLegendRef = this.onLegendRef.bind(this); + this.onChartRef = this.onChartRef.bind(this); + } + + handleClick() { + debugger; + } + + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+
+ +
+
+ + +
+
+
+ ) + } } \ No newline at end of file diff --git a/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js b/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js index 1aacee12f..b3ba47b90 100644 --- a/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js +++ b/packages/cli/templates/react/igr-es6/radial-gauge/default/files/src/views/__path__/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Component } from 'react'; import style from './style.css'; import { IgrRadialGaugeModule } from 'igniteui-react-gauges'; import { IgrRadialGauge } from 'igniteui-react-gauges'; @@ -6,56 +6,61 @@ import { IgrRadialGauge } from 'igniteui-react-gauges'; IgrRadialGaugeModule.register(); -export default function $(ClassName)() { - const title = 'Radial Gauge'; +export default class $(ClassName) extends Component { + title = 'Radial Gauge' + state = { + data: [] + }; - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- - -
-
- - -
-
-
- ) + render() { + return ( +
+

{this.title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + +
+
+ + +
+
+
+ ) + } } \ No newline at end of file From db1780c957e499a46932e7660aa8aefdbab2f5e9 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 14 Sep 2023 16:14:00 +0300 Subject: [PATCH 06/66] Revert "switch to react functions initial commit" This reverts commit 338bd1ed1e392851caa095baf5e2893f9bed24c2. --- .../igr-es6/projects/_base/files/package.json | 2 +- .../_base/files/src/views/home/index.js | 41 ++++++++------ .../igr-es6/projects/top-nav/files/src/App.js | 56 ++++++++++--------- .../src/components/navigation-header/index.js | 48 +++++++++------- 4 files changed, 82 insertions(+), 65 deletions(-) diff --git a/packages/cli/templates/react/igr-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-es6/projects/_base/files/package.json index 367305c38..d16f609d8 100644 --- a/packages/cli/templates/react/igr-es6/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-es6/projects/_base/files/package.json @@ -8,7 +8,7 @@ "react-app-polyfill": "^0.2.0", "react-dom": "^16.8.2", "react-router-dom": "^4.3.1", - "react-scripts": "^5.0.1" + "react-scripts": "2.1.5" }, "devDependencies": { "igniteui-cli": "~$(cliVersion)", diff --git a/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js b/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js index 814025fd1..326cb03ae 100644 --- a/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js +++ b/packages/cli/templates/react/igr-es6/projects/_base/files/src/views/home/index.js @@ -1,22 +1,27 @@ -import React from 'react'; +import React, { Component } from 'react'; import logo from './logo.svg'; import styles from './style.css'; -export default function Home() { - return ( -
- logo -

- Welcome to Ignite UI for React! -

- - Learn More - -
- ) +export default class Home extends Component { + state = { + } + + render () { + return ( +
+ logo +

+ Welcome to Ignite UI for React! +

+ + Learn More + +
+ ) + } } diff --git a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js index 2e575a27a..c120a8c9d 100644 --- a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js +++ b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/App.js @@ -1,32 +1,36 @@ -import React from "react"; +import React, { Component } from "react"; import { Route, BrowserRouter as Router, Switch } from "react-router-dom"; import asyncComponent from "./hoc/asyncComponent"; import NavigationHeader from "./components/navigation-header/index"; import routes from "./routes.json"; import "./App.css"; -export default function App() { - const name = "$(name)"; - return ( - -
-
{name}
- -
- - {routes.map((route, i) => ( - - import("" + route.componentPath) - )} - /> - ))} - -
-
- - ); -} \ No newline at end of file +class App extends Component { + name = "$(name)"; + render() { + return ( + +
+
{this.name}
+ +
+ + {routes.map((route, i) => ( + + import("" + route.componentPath) + )} + /> + ))} + +
+
+ + ); + } +} + +export default App; diff --git a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js index 4eecfd6d4..f951ab181 100644 --- a/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js +++ b/packages/cli/templates/react/igr-es6/projects/top-nav/files/src/components/navigation-header/index.js @@ -1,29 +1,37 @@ -import React, { useState, useEffect } from 'react'; +import React, { Component } from 'react'; import { NavLink } from 'react-router-dom'; -export default function NavigationHeader({ routes }) { - const [state, setState] = useState({ activeItem: null }); +export default class NavigationHeader extends Component { + state = { + activeItem: null + } - function handleClick(index) { - setState({ activeItem: index }); + handleClick(index) { + this.setState({ + activeItem: index + }) } - useEffect(() => { + componentWillMount() { let currentRoute = window.location.href.split(window.location.origin)[1]; if (!currentRoute) { currentRoute = '/' } - const activeItem = routes.findIndex((route) => route.path === currentRoute); - setState({ activeItem }); - }, [routes]); - - return ( - - ) -} \ No newline at end of file + const activeItem = this.props.routes.findIndex((route) => route.path === currentRoute); + this.setState({ + activeItem + }); + } + + render() { + return ( + + ) + } +} \ No newline at end of file From cbfdf9a178290c739c4f03a20791409ac15f19ca Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 14 Sep 2023 16:17:36 +0300 Subject: [PATCH 07/66] chore(*): fix template names --- .../cli/templates/react/igr-ts-es6/pie-chart/default/index.ts | 4 ++-- packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts index 3eb0eb899..7e7eda3f8 100644 --- a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts @@ -1,6 +1,6 @@ import { IgniteUIForReactTemplate } from "../../../../../lib/templates/IgniteUIForReactTemplate"; -class IgrPieChartTemplate extends IgniteUIForReactTemplate { +class IgrTsPieChartTemplate extends IgniteUIForReactTemplate { constructor() { super(__dirname); this.components = ["Pie Chart"]; @@ -13,4 +13,4 @@ class IgrPieChartTemplate extends IgniteUIForReactTemplate { this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json } } -module.exports = new IgrPieChartTemplate(); +module.exports = new IgrTsPieChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts b/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts index ff8c59949..d297e1573 100644 --- a/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts @@ -1,7 +1,7 @@ import { BaseComponent } from "@igniteui/cli-core"; -class IgrRadialGaugeComponent extends BaseComponent { +class IgrTsRadialGaugeComponent extends BaseComponent { /** * */ @@ -13,4 +13,4 @@ class IgrRadialGaugeComponent extends BaseComponent { and labels, in order to create a predefined shape and scale.`; } } -module.exports = new IgrRadialGaugeComponent(); +module.exports = new IgrTsRadialGaugeComponent(); From 237e8ddd712427040031f0389e7e67758c357e11 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 14 Sep 2023 16:27:25 +0300 Subject: [PATCH 08/66] chore(*): fix comment --- packages/cli/lib/templates/IgniteUIForReactTemplate.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 43eec69ac..bb78cdb7d 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -12,7 +12,7 @@ export class IgniteUIForReactTemplate implements Template { public description: string; public dependencies: string[] = []; public framework: string = "react"; - public projectType = "igr-ts-es6"; // TEMP + public projectType = "igr-ts-es6"; // temp public hasExtraConfiguration: boolean = false; public packages = []; public delimiters = defaultDelimiters; From 53b96188f24231c73cdb665202c9af167fa17997 Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Fri, 15 Sep 2023 02:15:44 +0300 Subject: [PATCH 09/66] fix(igr-ts-es6): configure tests --- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../basic/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../grid/basic/files/src/views/__path__/test.tsx | 9 --------- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ .../default/files/src/views/__path__/test.tsx | 9 --------- .../igr-ts-es6/projects/_base/files/package.json | 12 ++++++++++-- .../igr-ts-es6/projects/_base/files/src/App.test.tsx | 12 ++++++------ .../igr-ts-es6/projects/_base/files/vite.config.ts | 9 +++++++++ .../projects/top-nav/files/src/setupTests.ts | 4 ++++ .../projects/top-nav/files/src/setupTests.tsx | 4 ---- .../default/files/src/views/__path__/index.test.tsx | 8 ++++++++ 20 files changed, 93 insertions(+), 75 deletions(-) create mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx delete mode 100644 packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts delete mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx deleted file mode 100644 index ea320de9e..000000000 --- a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; -import { shallow } from 'enzyme'; - -it('$(ClassName) renders without crashing', () => { - const wrapperComponent = shallow(<$(ClassName) />); - expect(wrapperComponent).toBeDefined(); - expect(wrapperComponent).toBeTruthy(); -}); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json index 91c02635b..97e09dcab 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json @@ -4,11 +4,17 @@ "private": true, "type": "module", "dependencies": { + "@testing-library/jest-dom": "^6.1.3", + "@testing-library/react": "^14.0.0", + "functions-have-names": "^1.2.3", "igniteui-react-core": "18.2.2-beta.0", "react": "^18.2.0", "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", - "react-router-dom": "5.3.4" + "react-router-dom": "5.3.4", + "react-native-get-random-values": "^1.9.0", + "resize-observer-polyfill": "^1.5.1", + "vitest": "^0.34.4" }, "devDependencies": { "@types/react": "^18.2.15", @@ -19,6 +25,7 @@ "eslint": "^8.46.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", + "jsdom": "^22.1.0", "typescript": "^5.0.2", "vite": "^4.4.9", "igniteui-cli": "~$(cliVersion)" @@ -27,7 +34,8 @@ "start": "vite", "build": "tsc && vite build", "preview": "vite preview", - "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0" + "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", + "test": "vitest" }, "eslintConfig": { "extends": "react-app" diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx index a754b201b..b63d55b3f 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx @@ -1,9 +1,9 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; +import { expect, test } from 'vitest'; +import { render, screen } from '@testing-library/react'; import App from './App'; -it('renders without crashing', () => { - const div = document.createElement('div'); - ReactDOM.render(, div); - ReactDOM.unmountComponentAtNode(div); +test('renders without crashing', () => { + render(); + const home = screen.getByRole('link'); + expect(home).toBeTruthy(); }); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts index 5a33944a9..753f93629 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts @@ -1,7 +1,16 @@ +/// import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], + test: { + globals: true, + environment: 'jsdom', + setupFiles: ['./src/setupTests.ts'] + }, + resolve: { + mainFields: ['module'], + } }) diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts new file mode 100644 index 000000000..cc50b0412 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts @@ -0,0 +1,4 @@ +import '@testing-library/jest-dom' +import ResizeObserver from 'resize-observer-polyfill' + +global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx deleted file mode 100644 index acd71d494..000000000 --- a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.tsx +++ /dev/null @@ -1,4 +0,0 @@ -import Enzyme from 'enzyme'; -import Adapter from 'enzyme-adapter-react-16'; - -Enzyme.configure({ adapter: new Adapter() }); \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx new file mode 100644 index 000000000..0dedf55d9 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import $(ClassName) from './index'; + +test('renders $(ClassName) component', () => { + const wrapper = render(<$(ClassName) />); + expect(wrapper).toBeTruthy(); +}); \ No newline at end of file From 5b662e2799932758e519c1b6f051d3e9676dc615 Mon Sep 17 00:00:00 2001 From: igdmdimitrov Date: Fri, 15 Sep 2023 13:22:48 +0300 Subject: [PATCH 10/66] chore(*): remove %PUBLIC_URL% from index.html --- .../igr-ts-es6/projects/_base/files/index.html | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html index 1c336173c..0c9022edb 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html @@ -2,7 +2,7 @@ - + - - + IgniteUI for React From 66dcf4bd7702d7be5462d73a1767ecd468a400f5 Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Mon, 18 Sep 2023 18:29:02 +0300 Subject: [PATCH 11/66] chore(*): make app test more generic --- .../views/__path__/{style.module..css => style.module.css} | 0 .../react/igr-ts-es6/projects/_base/files/src/App.test.tsx | 7 +++---- 2 files changed, 3 insertions(+), 4 deletions(-) rename packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/{style.module..css => style.module.css} (100%) diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module..css b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module..css rename to packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx index b63d55b3f..e15e55062 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx @@ -1,9 +1,8 @@ import { expect, test } from 'vitest'; -import { render, screen } from '@testing-library/react'; +import { render } from '@testing-library/react'; import App from './App'; test('renders without crashing', () => { - render(); - const home = screen.getByRole('link'); - expect(home).toBeTruthy(); + const wrapper = render(); + expect(wrapper).toBeTruthy(); }); From ba26186e94a9595b1d3c8751e1aa060a89208f84 Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Tue, 19 Sep 2023 14:10:15 +0300 Subject: [PATCH 12/66] chore(*): update test config and clean leftovers --- .../files/src/views/__path__/index.tsx | 4 +- .../files/src/views/__path__/index.tsx | 65 +++++++++---------- .../files/src/views/__path__/index.tsx | 1 - .../projects/_base/files/package.json | 1 + .../projects/_base/files/vite.config.ts | 22 ++++--- .../projects/top-nav/files/src/setupTests.ts | 1 + .../files/src/views/__path__/index.tsx | 2 +- .../__path__/{style.css => style.module.css} | 0 .../default/files/src/views/__path__/test.tsx | 9 --- 9 files changed, 49 insertions(+), 56 deletions(-) rename packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/{style.css => style.module.css} (100%) delete mode 100644 packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx index 115245b1c..67771db02 100644 --- a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx @@ -5,7 +5,7 @@ import style from './style.module.css'; IgrCategoryChartModule.register(); -var data = [ +const data = [ { 'CountryName': 'China', 'Pop1995': 1216, 'Pop2005': 1297, 'Pop2015': 1361, 'Pop2025': 1394 }, { 'CountryName': 'India', 'Pop1995': 920, 'Pop2005': 1090, 'Pop2015': 1251, 'Pop2025': 1396 }, { 'CountryName': 'United States', 'Pop1995': 266, 'Pop2005': 295, 'Pop2015': 322, 'Pop2025': 351 }, @@ -13,7 +13,7 @@ var data = [ { 'CountryName': 'Brazil', 'Pop1995': 161, 'Pop2005': 186, 'Pop2015': 204, 'Pop2025': 218 } ]; -export default class $(ClassName)() { +export default function $(ClassName)() { const title = 'Category Chart'; const [chartData, setChartData] = useState([]); diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx index dfe7056e6..a35b60488 100644 --- a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx @@ -5,7 +5,6 @@ import { IgrRingSeriesModule } from 'igniteui-react-charts'; import { IgrRingSeries } from 'igniteui-react-charts'; import { IgrItemLegendModule } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; - import style from './style.module.css'; IgrItemLegendModule.register(); @@ -25,42 +24,40 @@ const data = [ export default function $(ClassName)() { const title = 'Doughnut Chart'; const [chartData, setChartData] = useState([]); - let legendRef = useRef(); - let chartRef = useRef(); + const legendRef = useRef(); + const chartRef = useRef(); useEffect(() => { setChartData(data); }, []); - render() { - return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- -
-
- - - -
-
-
- ) - } + return ( +
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ +
+
+ + + +
+
+
+ ) } diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx index caa714927..2cbe6d342 100644 --- a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx @@ -3,7 +3,6 @@ import { IgrPieChartModule } from 'igniteui-react-charts'; import { IgrPieChart } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; import { IgrItemLegendModule } from 'igniteui-react-charts'; - import style from './style.module.css'; IgrPieChartModule.register(); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json index 97e09dcab..43d434645 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json @@ -28,6 +28,7 @@ "jsdom": "^22.1.0", "typescript": "^5.0.2", "vite": "^4.4.9", + "vitest-canvas-mock": "^0.3.3", "igniteui-cli": "~$(cliVersion)" }, "scripts": { diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts index 753f93629..1e885b690 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts @@ -4,13 +4,17 @@ import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], - test: { - globals: true, - environment: 'jsdom', - setupFiles: ['./src/setupTests.ts'] - }, - resolve: { - mainFields: ['module'], - } + define: process.env.VITEST ? {} : { global: 'window' }, + plugins: [react()], + test: { + globals: true, + environment: 'jsdom', + setupFiles: ['./src/setupTests.ts'], + deps: { + inline: ['vitest-canvas-mock'], + }, + }, + resolve: { + mainFields: ['module'], + } }) diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts index cc50b0412..698aeae9f 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts @@ -1,4 +1,5 @@ import '@testing-library/jest-dom' +import 'vitest-canvas-mock' import ResizeObserver from 'resize-observer-polyfill' global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx index 1aacee12f..eeadf8233 100644 --- a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import style from './style.css'; import { IgrRadialGaugeModule } from 'igniteui-react-gauges'; import { IgrRadialGauge } from 'igniteui-react-gauges'; +import style from './style.module.css'; IgrRadialGaugeModule.register(); diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.css rename to packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx b/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx deleted file mode 100644 index 0acf929af..000000000 --- a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/test.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react'; -import $(ClassName) from './index'; - -it('$(ClassName) renders without crashing', () => { - // const wrapperComponent = shallow(<$(ClassName) />); - // expect(wrapperComponent).toBeDefined(); - // expect(wrapperComponent).toBeTruthy(); - expect(true).toBeTruthy(); -}); From a0d59cabbf8ae05179acbc90360f59df54741640 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Tue, 19 Sep 2023 15:36:55 +0300 Subject: [PATCH 13/66] chore(*): uncomment groups logic --- packages/cli/templates/react/igr-ts-es6/index.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/cli/templates/react/igr-ts-es6/index.ts b/packages/cli/templates/react/igr-ts-es6/index.ts index 4df8d3a97..a49120b40 100644 --- a/packages/cli/templates/react/igr-ts-es6/index.ts +++ b/packages/cli/templates/react/igr-ts-es6/index.ts @@ -7,11 +7,11 @@ class IgrTsReactProjectLibrary extends BaseProjectLibrary { this.projectType = "igr-ts-es6"; this.themes = ["default"]; - // const groups = require("./groups.json"); - // // tslint:disable-next-line:forin - // for (const key in groups) { - // this.groupDescriptions.set(key, groups[key]); - // } + const groups = require("./groups.json"); + // tslint:disable-next-line:forin + for (const key in groups) { + this.groupDescriptions.set(key, groups[key]); + } } } module.exports = new IgrTsReactProjectLibrary(); From ff4206f590fd2003e64e733e97d048d542a6c6b0 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Tue, 19 Sep 2023 15:37:51 +0300 Subject: [PATCH 14/66] chore(*): add config for igr-ts-es6 process --- .vscode/launch.json | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/.vscode/launch.json b/.vscode/launch.json index 0be775ab6..1df2d9a80 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -87,6 +87,22 @@ "--framework=react" ] }, + { + "type": "node", + "request": "launch", + "name": "Launch New React TS ES6", + "cwd": "${workspaceRoot}/output", + "program": "${workspaceRoot}/packages/cli/bin/execute.js", + "console": "externalTerminal", + "preLaunchTask": "build", + "outFiles": ["${workspaceFolder}/**/*.js"], + "args": [ + "new", + "reactproj", + "--framework=react", + "--type=igr-ts-es6" + ] + }, { "type": "node", "request": "launch", From 3c73ff9dc496e3f11d16bf35bd6b4bee9d1f31e2 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Tue, 19 Sep 2023 15:38:16 +0300 Subject: [PATCH 15/66] chore(*): add groups.json --- packages/cli/templates/react/igr-ts-es6/groups.json | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 packages/cli/templates/react/igr-ts-es6/groups.json diff --git a/packages/cli/templates/react/igr-ts-es6/groups.json b/packages/cli/templates/react/igr-ts-es6/groups.json new file mode 100644 index 000000000..4d9ba21df --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/groups.json @@ -0,0 +1,5 @@ +{ + "Gauges": "scale measure Controls including Linear and Radial Gauge and Bullet Graph.", + "Charts": "high-performance data visualization for category and financial data.", + "Grids & Lists": "bind and display data sets with little coding or configuration." +} \ No newline at end of file From 5cb30d286335597b703a5e6da0e2316fe204fb70 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 20 Sep 2023 14:28:16 +0300 Subject: [PATCH 16/66] feat(igr-ts-es6): add base with home template + minor chanegs --- .../cli/templates/react/igr-ts-es6/index.ts | 2 +- .../projects/_base/files/src/routes.json | 6 +----- .../files/public}/logo.svg | 0 .../files/src/App.module.css} | 12 ++++++++++-- .../files/src/App.tsx} | 10 +++++++--- .../_base_with_home/files/src/setupTests.ts | 5 +++++ .../projects/_base_with_home/index.ts | 18 ++++++++++++++++++ .../react/igr-ts-es6/projects/empty/index.ts | 18 ++++++++++++++++++ 8 files changed, 60 insertions(+), 11 deletions(-) rename packages/cli/templates/react/igr-ts-es6/projects/{_base/files/src/views/home => _base_with_home/files/public}/logo.svg (100%) rename packages/cli/templates/react/igr-ts-es6/projects/{_base/files/src/views/home/style.module.css => _base_with_home/files/src/App.module.css} (70%) rename packages/cli/templates/react/igr-ts-es6/projects/{_base/files/src/views/home/index.tsx => _base_with_home/files/src/App.tsx} (63%) create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/index.ts b/packages/cli/templates/react/igr-ts-es6/index.ts index a49120b40..fd77c57c6 100644 --- a/packages/cli/templates/react/igr-ts-es6/index.ts +++ b/packages/cli/templates/react/igr-ts-es6/index.ts @@ -3,7 +3,7 @@ import { BaseProjectLibrary } from "@igniteui/cli-core"; class IgrTsReactProjectLibrary extends BaseProjectLibrary { constructor() { super(__dirname); - this.name = "Ignite UI for React"; + this.name = "Ignite UI for React TS"; this.projectType = "igr-ts-es6"; this.themes = ["default"]; diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json index 62ca363d6..41b42e677 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json @@ -1,7 +1,3 @@ [ - { - "path": "/", - "componentPath": "./views/home", - "text": "Home" - } + ] diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/public/logo.svg similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/logo.svg rename to packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/public/logo.svg diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.module.css b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.module.css similarity index 70% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.module.css rename to packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.module.css index 304d9b24e..c38cc0c19 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/style.module.css +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.module.css @@ -1,4 +1,3 @@ -/* CSS Modules https://medium.com/@pioul/modular-css-with-react-61638ae9ea3e */ :local(.logo) { animation: App-logo-spin infinite 20s linear; height: 40vmin; @@ -18,6 +17,15 @@ color: #61dafb; } +:local(.app__name) { + padding-top: 1em; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); +} + @keyframes App-logo-spin { from { transform: rotate(0deg); @@ -25,4 +33,4 @@ to { transform: rotate(360deg); } -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.tsx similarity index 63% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx rename to packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.tsx index 3424d4e2f..5aee63035 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/views/home/index.tsx +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.tsx @@ -1,9 +1,12 @@ import React from 'react'; -import logo from './logo.svg'; -import styles from './style.module.css'; +import logo from '/logo.svg'; +import styles from './App.module.css'; -export default function Home() { +export default function App() { + const name = "$(name)"; return ( +
+
{name}
logo

@@ -18,5 +21,6 @@ export default function Home() { Learn More

+
) } diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts new file mode 100644 index 000000000..698aeae9f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts @@ -0,0 +1,5 @@ +import '@testing-library/jest-dom' +import 'vitest-canvas-mock' +import ResizeObserver from 'resize-observer-polyfill' + +global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts new file mode 100644 index 000000000..b35d94c79 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts @@ -0,0 +1,18 @@ +import { ProjectTemplate } from "@igniteui/cli-core"; +import * as path from "path"; +import { BaseIgrTsProject } from "../_base"; + +export class BaseWithHomeIgrTsProject extends BaseIgrTsProject implements ProjectTemplate { + public id: string = "base-with-home"; + public name = "Base with home"; + public description = "React project structure with home view"; + public dependencies: string[] = []; + public framework: string = "react"; + public projectType: string = "igr-ts-es6"; + public hasExtraConfiguration: boolean = false; + + public get templatePaths(): string[] { + return [...super.templatePaths, path.join(__dirname, "files")]; + } +} +export default new BaseWithHomeIgrTsProject(); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts b/packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts new file mode 100644 index 000000000..e81687794 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts @@ -0,0 +1,18 @@ +import { ProjectTemplate } from "@igniteui/cli-core"; +import * as path from "path"; +import { BaseWithHomeIgrTsProject } from "../_base_with_home"; + +export class EmptyIgrTsProject extends BaseWithHomeIgrTsProject implements ProjectTemplate { + public id: string = "empty"; + public name = "Empty project"; + public description = "Empty project structure with home page"; + public dependencies: string[] = []; + public framework: string = "react"; + public projectType: string = "igr-ts-es6"; + public hasExtraConfiguration: boolean = false; + + public get templatePaths(): string[] { + return [...super.templatePaths, path.join(__dirname, "files")]; + } +} +export default new EmptyIgrTsProject(); From f22c14dc60ca436b084e2bf9f097ff0848f80d21 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 20 Sep 2023 15:00:20 +0300 Subject: [PATCH 17/66] feat(igr-ts-es6): add view to top-nav --- .../projects/top-nav/files/src/routes.json | 7 +++++ .../top-nav/files/src/views/home/index.tsx | 22 +++++++++++++++ .../top-nav/files/src/views/home/logo.svg | 7 +++++ .../files/src/views/home/style.module.css | 27 +++++++++++++++++++ 4 files changed, 63 insertions(+) create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json new file mode 100644 index 000000000..62ca363d6 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json @@ -0,0 +1,7 @@ +[ + { + "path": "/", + "componentPath": "./views/home", + "text": "Home" + } +] diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx new file mode 100644 index 000000000..3424d4e2f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx @@ -0,0 +1,22 @@ +import React from 'react'; +import logo from './logo.svg'; +import styles from './style.module.css'; + +export default function Home() { + return ( +
+ logo +

+ Welcome to Ignite UI for React! +

+ + Learn More + +
+ ) +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg new file mode 100644 index 000000000..6b60c1042 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css new file mode 100644 index 000000000..37275755a --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css @@ -0,0 +1,27 @@ +:local(.logo) { + animation: App-logo-spin infinite 20s linear; + height: 40vmin; +} + +:local(.header) { + padding-top: 5em; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: calc(10px + 2vmin); + color: #333; +} + +:local(.link) { + color: #61dafb; +} + +@keyframes App-logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} From 4fa476e31b76c6d9e9691baa63743f5e2d90ae94 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 25 Sep 2023 11:00:58 +0300 Subject: [PATCH 18/66] chore(*): update readme --- .../templates/react/igr-ts-es6/projects/_base/files/README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md index 8dd09f816..2a81595a4 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md @@ -1,7 +1,7 @@ # $(name) This project was generated with [Ignite UI CLI](https://github.com/IgniteUI/igniteui-cli) version $(cliVersion).
-The template builds upon a project bootstrapped with [Create React App](https://github.com/facebook/create-react-app), so all CRA features are available in this project. +The template builds upon a project bootstrapped with [Vite](https://vitejs.dev/). ## Development server @@ -40,7 +40,7 @@ Run `ig test` to execute the unit tests. To get more help on the IgniteUI CLI go check out the [IgniteUI CLI Wiki](https://github.com/IgniteUI/igniteui-cli/wiki). -Learn more about CRA features in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). +Learn more about Vite features in the [Vite documentation](https://vitejs.dev/guide/). To learn React, check out the [React documentation](https://reactjs.org/). From 0fb7a31e2b94e03d3c38de05cf769dfdfad6455e Mon Sep 17 00:00:00 2001 From: lipata Date: Mon, 25 Sep 2023 11:56:01 +0300 Subject: [PATCH 19/66] chore: release 12.0.6-alpha.0 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 378cdf9f8..8b9d63447 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.0.5", + "version": "12.0.6-alpha.0", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1205", - "@igniteui/cli-core": "~12.0.5", + "@igniteui/angular-templates": "~16.0.1206-alpha.0", + "@igniteui/cli-core": "~12.0.6-alpha.0", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 4c7adbe08..09ccb1b60 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.0.5", + "version": "12.0.6-alpha.0", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index fa629eff3..826e5f0c8 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1205", + "version": "16.0.1206-alpha.0", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.0.5", + "@igniteui/cli-core": "~12.0.6-alpha.0", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 606e8e830..0ff6723a3 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1205", + "version": "16.0.1206-alpha.0", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1205", - "@igniteui/cli-core": "~12.0.5", + "@igniteui/angular-templates": "~16.0.1206-alpha.0", + "@igniteui/cli-core": "~12.0.6-alpha.0", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 7f6d432847849c3b6df8e076a76afca11023cc81 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 27 Sep 2023 14:30:38 +0300 Subject: [PATCH 20/66] feat(react): add base template --- .../projects/_base/files/src/App.tsx | 11 +++++++++++ .../projects/_base/files/src/setupTests.ts | 5 +++++ .../_base_with_home/files/src/App.test.tsx | 8 ++++++++ .../react/igr-ts-es6/projects/base/index.ts | 18 ++++++++++++++++++ 4 files changed, 42 insertions(+) create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx create mode 100644 packages/cli/templates/react/igr-ts-es6/projects/base/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx new file mode 100644 index 000000000..c13d04faf --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx @@ -0,0 +1,11 @@ +import React from 'react'; +import { BrowserRouter as Router } from "react-router-dom"; + +export default function App() { + + return ( +
+ +
+ ) +} diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts new file mode 100644 index 000000000..698aeae9f --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts @@ -0,0 +1,5 @@ +import '@testing-library/jest-dom' +import 'vitest-canvas-mock' +import ResizeObserver from 'resize-observer-polyfill' + +global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx new file mode 100644 index 000000000..e15e55062 --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx @@ -0,0 +1,8 @@ +import { expect, test } from 'vitest'; +import { render } from '@testing-library/react'; +import App from './App'; + +test('renders without crashing', () => { + const wrapper = render(); + expect(wrapper).toBeTruthy(); +}); diff --git a/packages/cli/templates/react/igr-ts-es6/projects/base/index.ts b/packages/cli/templates/react/igr-ts-es6/projects/base/index.ts new file mode 100644 index 000000000..8ce0436bd --- /dev/null +++ b/packages/cli/templates/react/igr-ts-es6/projects/base/index.ts @@ -0,0 +1,18 @@ +import { ProjectTemplate } from "@igniteui/cli-core"; +import * as path from "path"; +import { BaseIgrTsProject } from "../_base"; + +export class BasePageIgrTsProject extends BaseIgrTsProject implements ProjectTemplate { + public id: string = "base"; + public name = "Base project"; + public description = "Empty project structure"; + public dependencies: string[] = []; + public framework: string = "react"; + public projectType: string = "igr-ts-es6"; + public hasExtraConfiguration: boolean = false; + + public get templatePaths(): string[] { + return [...super.templatePaths, path.join(__dirname, "files")]; + } +} +export default new BasePageIgrTsProject(); From 7d4121f3d98c12bfadd1e958fa62008bddaf4741 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 27 Sep 2023 15:11:57 +0300 Subject: [PATCH 21/66] fix(react): igr-ts-es6 -> ig-ts --- .../cli/lib/templates/IgniteUIForReactTemplate.ts | 2 +- .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../bullet-graph/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/bullet-graph/index.ts | 0 .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../category-chart/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/category-chart/index.ts | 0 .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../doughnut-chart/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/doughnut-chart/index.ts | 0 .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../financial-chart/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/financial-chart/index.ts | 0 .../grid/basic/files/src/views/__path__/data.tsx | 0 .../basic/files/src/views/__path__/index.test.tsx | 0 .../grid/basic/files/src/views/__path__/index.tsx | 0 .../basic/files/src/views/__path__/style.module.css | 0 .../{igr-ts-es6 => igr-ts}/grid/basic/index.ts | 2 +- .../react/{igr-ts-es6 => igr-ts}/grid/index.ts | 0 .../react/{igr-ts-es6 => igr-ts}/groups.json | 0 .../templates/react/{igr-ts-es6 => igr-ts}/index.ts | 2 +- .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../linear-gauge/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/linear-gauge/index.ts | 0 .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../pie-chart/default/index.ts | 2 +- .../react/{igr-ts-es6 => igr-ts}/pie-chart/index.ts | 0 .../projects/_base/files/README.md | 0 .../projects/_base/files/__dot__editorconfig | 0 .../projects/_base/files/__dot__env | 0 .../projects/_base/files/__dot__eslintrc.cjs | 0 .../projects/_base/files/__dot__gitignore | 0 .../projects/_base/files/ignite-ui-cli.json | 2 +- .../projects/_base/files/index.html | 0 .../projects/_base/files/package.json | 0 .../projects/_base/files/public/favicon.ico | Bin .../projects/_base/files/public/manifest.json | 0 .../projects/_base/files/src/App.test.tsx | 0 .../projects/_base/files/src/App.tsx | 0 .../projects/_base/files/src/hoc/asyncComponent.tsx | 0 .../projects/_base/files/src/index.css | 0 .../projects/_base/files/src/main.tsx | 0 .../projects/_base/files/src/routes.json | 0 .../projects/_base/files/src/serviceWorker.tsx | 0 .../projects/_base/files/src/setupTests.ts | 0 .../projects/_base/files/src/vite-env.d.ts | 0 .../projects/_base/files/tsconfig.json | 0 .../projects/_base/files/tsconfig.node.json | 0 .../projects/_base/files/vite.config.ts | 0 .../{igr-ts-es6 => igr-ts}/projects/_base/index.ts | 0 .../projects/_base_with_home/files/public/logo.svg | 0 .../_base_with_home/files/src/App.module.css | 0 .../projects/_base_with_home/files/src/App.test.tsx | 0 .../projects/_base_with_home/files/src/App.tsx | 0 .../_base_with_home/files/src/setupTests.ts | 0 .../projects/_base_with_home/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/projects/base/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/projects/empty/index.ts | 2 +- .../projects/top-nav/files/src/App.css | 0 .../projects/top-nav/files/src/App.tsx | 0 .../src/components/navigation-header/index.tsx | 0 .../projects/top-nav/files/src/routes.json | 0 .../projects/top-nav/files/src/setupTests.ts | 0 .../projects/top-nav/files/src/views/home/index.tsx | 0 .../projects/top-nav/files/src/views/home/logo.svg | 0 .../top-nav/files/src/views/home/style.module.css | 0 .../projects/top-nav/index.ts | 2 +- .../default/files/src/views/__path__/index.test.tsx | 0 .../default/files/src/views/__path__/index.tsx | 0 .../files/src/views/__path__/style.module.css | 0 .../radial-gauge/default/index.ts | 2 +- .../{igr-ts-es6 => igr-ts}/radial-gauge/index.ts | 0 packages/cli/templates/react/index.ts | 2 +- packages/core/util/Util.ts | 2 +- 86 files changed, 17 insertions(+), 17 deletions(-) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/bullet-graph/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/bullet-graph/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/bullet-graph/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/bullet-graph/default/index.ts (94%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/bullet-graph/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/category-chart/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/category-chart/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/category-chart/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/category-chart/default/index.ts (95%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/category-chart/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/doughnut-chart/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/doughnut-chart/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/doughnut-chart/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/doughnut-chart/default/index.ts (94%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/doughnut-chart/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/financial-chart/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/financial-chart/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/financial-chart/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/financial-chart/default/index.ts (95%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/financial-chart/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/basic/files/src/views/__path__/data.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/basic/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/basic/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/basic/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/basic/index.ts (94%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/grid/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/groups.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/index.ts (92%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/linear-gauge/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/linear-gauge/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/linear-gauge/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/linear-gauge/default/index.ts (94%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/linear-gauge/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/pie-chart/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/pie-chart/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/pie-chart/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/pie-chart/default/index.ts (94%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/pie-chart/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/README.md (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/__dot__editorconfig (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/__dot__env (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/__dot__eslintrc.cjs (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/__dot__gitignore (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/ignite-ui-cli.json (89%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/index.html (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/package.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/public/favicon.ico (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/public/manifest.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/App.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/App.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/hoc/asyncComponent.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/index.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/main.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/routes.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/serviceWorker.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/setupTests.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/src/vite-env.d.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/tsconfig.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/tsconfig.node.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/files/vite.config.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base/index.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/files/public/logo.svg (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/files/src/App.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/files/src/App.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/files/src/App.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/files/src/setupTests.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/_base_with_home/index.ts (93%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/base/index.ts (93%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/empty/index.ts (93%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/App.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/App.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/components/navigation-header/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/routes.json (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/setupTests.ts (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/views/home/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/views/home/logo.svg (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/files/src/views/home/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/projects/top-nav/index.ts (93%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/radial-gauge/default/files/src/views/__path__/index.test.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/radial-gauge/default/files/src/views/__path__/index.tsx (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/radial-gauge/default/files/src/views/__path__/style.module.css (100%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/radial-gauge/default/index.ts (95%) rename packages/cli/templates/react/{igr-ts-es6 => igr-ts}/radial-gauge/index.ts (100%) diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index bb78cdb7d..c0f302108 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -12,7 +12,7 @@ export class IgniteUIForReactTemplate implements Template { public description: string; public dependencies: string[] = []; public framework: string = "react"; - public projectType = "igr-ts-es6"; // temp + public projectType = "igr-ts"; // temp public hasExtraConfiguration: boolean = false; public packages = []; public delimiters = defaultDelimiters; diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts similarity index 94% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts rename to packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts index b56f4caf9..ff16ef775 100644 --- a/packages/cli/templates/react/igr-ts-es6/bullet-graph/default/index.ts +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts @@ -7,7 +7,7 @@ class IgrTsBulletGraphTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Gauges"; this.listInComponentTemplates = true; this.id = "bullet-graph"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Bullet Graph"; this.description = `allows for a linear and concise view of measures compared against a scale.`; this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json diff --git a/packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts b/packages/cli/templates/react/igr-ts/bullet-graph/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/bullet-graph/index.ts rename to packages/cli/templates/react/igr-ts/bullet-graph/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/category-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts similarity index 95% rename from packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts rename to packages/cli/templates/react/igr-ts/category-chart/default/index.ts index 1097fae47..7828c0edc 100644 --- a/packages/cli/templates/react/igr-ts-es6/category-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts @@ -7,7 +7,7 @@ class IgrTsCategoryChartTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Charts"; this.listInComponentTemplates = true; this.id = "category-chart"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Category Chart"; this.description = `makes visualizing category data easy. Simplifies the complexities of the data visualization domain into manageable API`; diff --git a/packages/cli/templates/react/igr-ts-es6/category-chart/index.ts b/packages/cli/templates/react/igr-ts/category-chart/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/category-chart/index.ts rename to packages/cli/templates/react/igr-ts/category-chart/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts similarity index 94% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts index 7eec3d33f..5ec2f48ea 100644 --- a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts @@ -7,7 +7,7 @@ class IgrTsDoughnutChartTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Charts"; this.listInComponentTemplates = true; this.id = "doughnut-chart"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Doughnut Chart"; this.description = `proportionally illustrate the occurrences of variables.`; this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json diff --git a/packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/doughnut-chart/index.ts rename to packages/cli/templates/react/igr-ts/doughnut-chart/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts similarity index 95% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts rename to packages/cli/templates/react/igr-ts/financial-chart/default/index.ts index 5c129bf87..d08a1e9b7 100644 --- a/packages/cli/templates/react/igr-ts-es6/financial-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts @@ -8,7 +8,7 @@ class IgrTsFinancialChartTemplate extends IgniteUIForReactTemplate { // set to true once bug with chart destoy is fixed this.listInComponentTemplates = false; this.id = "financial-chart"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Financial Chart"; this.description = `charting component that makes it easy to visualize financial data by using a simple and intuitive API.`; diff --git a/packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts b/packages/cli/templates/react/igr-ts/financial-chart/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/financial-chart/index.ts rename to packages/cli/templates/react/igr-ts/financial-chart/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/data.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/data.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/data.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts b/packages/cli/templates/react/igr-ts/grid/basic/index.ts similarity index 94% rename from packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts rename to packages/cli/templates/react/igr-ts/grid/basic/index.ts index 2e116514f..d1950b131 100644 --- a/packages/cli/templates/react/igr-ts-es6/grid/basic/index.ts +++ b/packages/cli/templates/react/igr-ts/grid/basic/index.ts @@ -11,7 +11,7 @@ class GridTemplate extends IgniteUIForReactTemplate { this.name = "Grid"; this.widget = "igGrid"; this.description = "IgrGrid template for React"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.components = ["Grid"]; this.controlGroup = "Data Grids"; // TODO: read version from igniteui-react-core in package.json diff --git a/packages/cli/templates/react/igr-ts-es6/grid/index.ts b/packages/cli/templates/react/igr-ts/grid/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/grid/index.ts rename to packages/cli/templates/react/igr-ts/grid/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/groups.json b/packages/cli/templates/react/igr-ts/groups.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/groups.json rename to packages/cli/templates/react/igr-ts/groups.json diff --git a/packages/cli/templates/react/igr-ts-es6/index.ts b/packages/cli/templates/react/igr-ts/index.ts similarity index 92% rename from packages/cli/templates/react/igr-ts-es6/index.ts rename to packages/cli/templates/react/igr-ts/index.ts index fd77c57c6..f76625550 100644 --- a/packages/cli/templates/react/igr-ts-es6/index.ts +++ b/packages/cli/templates/react/igr-ts/index.ts @@ -4,7 +4,7 @@ class IgrTsReactProjectLibrary extends BaseProjectLibrary { constructor() { super(__dirname); this.name = "Ignite UI for React TS"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.themes = ["default"]; const groups = require("./groups.json"); diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts similarity index 94% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts rename to packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts index fc1c19434..25e3c9e25 100644 --- a/packages/cli/templates/react/igr-ts-es6/linear-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts @@ -7,7 +7,7 @@ class IgrTsLinearGaugeTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Gauges"; this.listInComponentTemplates = true; this.id = "linear-gauge"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Linear Gauge"; this.description = `value compared against a scale and one or more ranges.`; this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json diff --git a/packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts b/packages/cli/templates/react/igr-ts/linear-gauge/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/linear-gauge/index.ts rename to packages/cli/templates/react/igr-ts/linear-gauge/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts similarity index 94% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts rename to packages/cli/templates/react/igr-ts/pie-chart/default/index.ts index 7e7eda3f8..f0c62745f 100644 --- a/packages/cli/templates/react/igr-ts-es6/pie-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts @@ -7,7 +7,7 @@ class IgrTsPieChartTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Charts"; this.listInComponentTemplates = true; this.id = "pie-chart"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Pie Chart"; this.description = `easily illustate the proportions of data entries`; this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json diff --git a/packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts b/packages/cli/templates/react/igr-ts/pie-chart/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/pie-chart/index.ts rename to packages/cli/templates/react/igr-ts/pie-chart/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md b/packages/cli/templates/react/igr-ts/projects/_base/files/README.md similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/README.md rename to packages/cli/templates/react/igr-ts/projects/_base/files/README.md diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__editorconfig rename to packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__env rename to packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__eslintrc.cjs similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__eslintrc.cjs rename to packages/cli/templates/react/igr-ts/projects/_base/files/__dot__eslintrc.cjs diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__gitignore similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/__dot__gitignore rename to packages/cli/templates/react/igr-ts/projects/_base/files/__dot__gitignore diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json b/packages/cli/templates/react/igr-ts/projects/_base/files/ignite-ui-cli.json similarity index 89% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/ignite-ui-cli.json index 0b5e1920b..5a3f94d1b 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/ignite-ui-cli.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/ignite-ui-cli.json @@ -3,7 +3,7 @@ "project": { "defaultPort": 3003, "framework": "react", - "projectType": "igr-ts-es6", + "projectType": "igr-ts", "projectTemplate": "$(projectTemplate)", "theme": "$(theme)", "isBundle": false, diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html b/packages/cli/templates/react/igr-ts/projects/_base/files/index.html similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/index.html rename to packages/cli/templates/react/igr-ts/projects/_base/files/index.html diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/package.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/package.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/favicon.ico b/packages/cli/templates/react/igr-ts/projects/_base/files/public/favicon.ico similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/favicon.ico rename to packages/cli/templates/react/igr-ts/projects/_base/files/public/favicon.ico diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json b/packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/public/manifest.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.test.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/App.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/App.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/hoc/asyncComponent.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css b/packages/cli/templates/react/igr-ts/projects/_base/files/src/index.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/index.css rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/index.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/main.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json b/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/routes.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/serviceWorker.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/setupTests.ts rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/src/vite-env.d.ts rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json b/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json b/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/tsconfig.node.json rename to packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/files/vite.config.ts rename to packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts b/packages/cli/templates/react/igr-ts/projects/_base/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base/index.ts rename to packages/cli/templates/react/igr-ts/projects/_base/index.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/public/logo.svg b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/public/logo.svg similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/public/logo.svg rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/public/logo.svg diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.module.css b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.module.css rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.test.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/App.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/files/src/setupTests.ts rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts b/packages/cli/templates/react/igr-ts/projects/_base_with_home/index.ts similarity index 93% rename from packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/index.ts index b35d94c79..d875cff67 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/_base_with_home/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/index.ts @@ -8,7 +8,7 @@ export class BaseWithHomeIgrTsProject extends BaseIgrTsProject implements Projec public description = "React project structure with home view"; public dependencies: string[] = []; public framework: string = "react"; - public projectType: string = "igr-ts-es6"; + public projectType: string = "igr-ts"; public hasExtraConfiguration: boolean = false; public get templatePaths(): string[] { diff --git a/packages/cli/templates/react/igr-ts-es6/projects/base/index.ts b/packages/cli/templates/react/igr-ts/projects/base/index.ts similarity index 93% rename from packages/cli/templates/react/igr-ts-es6/projects/base/index.ts rename to packages/cli/templates/react/igr-ts/projects/base/index.ts index 8ce0436bd..a543908b1 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/base/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/base/index.ts @@ -8,7 +8,7 @@ export class BasePageIgrTsProject extends BaseIgrTsProject implements ProjectTem public description = "Empty project structure"; public dependencies: string[] = []; public framework: string = "react"; - public projectType: string = "igr-ts-es6"; + public projectType: string = "igr-ts"; public hasExtraConfiguration: boolean = false; public get templatePaths(): string[] { diff --git a/packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts b/packages/cli/templates/react/igr-ts/projects/empty/index.ts similarity index 93% rename from packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts rename to packages/cli/templates/react/igr-ts/projects/empty/index.ts index e81687794..1cc882162 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/empty/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/empty/index.ts @@ -8,7 +8,7 @@ export class EmptyIgrTsProject extends BaseWithHomeIgrTsProject implements Proje public description = "Empty project structure with home page"; public dependencies: string[] = []; public framework: string = "react"; - public projectType: string = "igr-ts-es6"; + public projectType: string = "igr-ts"; public hasExtraConfiguration: boolean = false; public get templatePaths(): string[] { diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.css rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/App.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/components/navigation-header/index.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/routes.json rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/setupTests.ts rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/index.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/logo.svg similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/logo.svg rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/logo.svg diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/files/src/views/home/style.module.css rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts b/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts similarity index 93% rename from packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts rename to packages/cli/templates/react/igr-ts/projects/top-nav/index.ts index 2e1a629cb..a9a7617c7 100644 --- a/packages/cli/templates/react/igr-ts-es6/projects/top-nav/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts @@ -8,7 +8,7 @@ export class TopNavIgrTsProject extends BaseIgrTsProject implements ProjectTempl public description = "Project structure with top navigation menu"; public dependencies: string[] = []; public framework: string = "react"; - public projectType: string = "igr-ts-es6"; + public projectType: string = "igr-ts"; public hasExtraConfiguration: boolean = false; public get templatePaths(): string[] { diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.test.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts similarity index 95% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts rename to packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts index 02f9d42ba..2cabb7de4 100644 --- a/packages/cli/templates/react/igr-ts-es6/radial-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts @@ -7,7 +7,7 @@ class IgrTsRadialGaugeTemplate extends IgniteUIForReactTemplate { this.controlGroup = "Gauges"; this.listInComponentTemplates = true; this.id = "radial-gauge"; - this.projectType = "igr-ts-es6"; + this.projectType = "igr-ts"; this.name = "Radial Gauge"; this.description = `provides a number of visual elements, like a needle, tick marks, ranges and labels, in order to create a predefined shape and scale.`; diff --git a/packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts b/packages/cli/templates/react/igr-ts/radial-gauge/index.ts similarity index 100% rename from packages/cli/templates/react/igr-ts-es6/radial-gauge/index.ts rename to packages/cli/templates/react/igr-ts/radial-gauge/index.ts diff --git a/packages/cli/templates/react/index.ts b/packages/cli/templates/react/index.ts index 91c41dc9f..c33bf0c53 100644 --- a/packages/cli/templates/react/index.ts +++ b/packages/cli/templates/react/index.ts @@ -11,7 +11,7 @@ class ReactFramework implements Framework { this.projectLibraries = []; this.projectLibraries.push(require("./es6") as ProjectLibrary); this.projectLibraries.push(require("./igr-es6") as ProjectLibrary); - this.projectLibraries.push(require("./igr-ts-es6") as ProjectLibrary); + this.projectLibraries.push(require("./igr-ts") as ProjectLibrary); } } export = new ReactFramework() as Framework; diff --git a/packages/core/util/Util.ts b/packages/core/util/Util.ts index 73bb2c26e..1db3c15fc 100644 --- a/packages/core/util/Util.ts +++ b/packages/core/util/Util.ts @@ -399,7 +399,7 @@ export class Util { specificPath = path.join("src", "app", "components"); } else if (framework === "react" && projectType === "es6") { specificPath = path.join("src", "components"); - } else if (framework === "react" && (projectType === "igr-es6" || projectType === "igr-ts-es6")) { + } else if (framework === "react" && (projectType === "igr-es6" || projectType === "igr-ts")) { specificPath = path.join("src", "views"); } else if (framework === "webcomponents" && projectType === "igc-ts") { specificPath = path.join("src", "app"); From 917a7ddf79e1dc93dddc61436c9ac5be2ebbb4c4 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 27 Sep 2023 15:46:55 +0300 Subject: [PATCH 22/66] chore(*): minor change in React template --- packages/cli/lib/templates/IgniteUIForReactTemplate.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index c0f302108..47cc6f193 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -12,7 +12,7 @@ export class IgniteUIForReactTemplate implements Template { public description: string; public dependencies: string[] = []; public framework: string = "react"; - public projectType = "igr-ts"; // temp + public projectType: string; public hasExtraConfiguration: boolean = false; public packages = []; public delimiters = defaultDelimiters; From 3fcdc88a87654e7119c92e4962a2d083dc72ba20 Mon Sep 17 00:00:00 2001 From: lipata Date: Wed, 27 Sep 2023 16:18:18 +0300 Subject: [PATCH 23/66] chore: release 12.0.6-alpha.1 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 8b9d63447..dba0a74f6 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.0.6-alpha.0", + "version": "12.0.6-alpha.1", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1206-alpha.0", - "@igniteui/cli-core": "~12.0.6-alpha.0", + "@igniteui/angular-templates": "~16.0.1206-alpha.1", + "@igniteui/cli-core": "~12.0.6-alpha.1", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 09ccb1b60..e815b3b77 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.0.6-alpha.0", + "version": "12.0.6-alpha.1", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index 826e5f0c8..3d441c7a7 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1206-alpha.0", + "version": "16.0.1206-alpha.1", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.0.6-alpha.0", + "@igniteui/cli-core": "~12.0.6-alpha.1", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 0ff6723a3..1a8521097 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1206-alpha.0", + "version": "16.0.1206-alpha.1", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1206-alpha.0", - "@igniteui/cli-core": "~12.0.6-alpha.0", + "@igniteui/angular-templates": "~16.0.1206-alpha.1", + "@igniteui/cli-core": "~12.0.6-alpha.1", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 19aa3f226a7d697e98b6842e36e502c26db6f960 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 28 Sep 2023 15:21:55 +0300 Subject: [PATCH 24/66] chore: update react grid to latest #1147 --- .../basic/files/src/views/__path__/index.tsx | 89 +++++++++++-------- .../react/igr-ts/grid/basic/index.ts | 4 +- .../igr-ts/projects/_base/files/package.json | 14 +-- 3 files changed, 62 insertions(+), 45 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx index d06ce39f4..b7bd81280 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx @@ -1,48 +1,63 @@ -import React from 'react'; +import { React } from 'react'; import style from './style.module.css'; -import { IgrDataGridModule } from 'igniteui-react-grids'; -import { IgrDataGrid } from 'igniteui-react-grids'; -import { IgrNumericColumn } from 'igniteui-react-grids'; -import { IgrTextColumn } from 'igniteui-react-grids'; -import { IgrDateTimeColumn } from 'igniteui-react-grids'; +import 'igniteui-react-grids/grids'; +import { IgrGridModule, IgrGrid, IgrColumn } from 'igniteui-react-grids'; +import 'igniteui-react-grids/grids/themes/light/bootstrap.css' import data from './data'; -IgrDataGridModule.register(); +IgrGridModule.register(); export default function $(ClassName)() { const title = 'Grid'; return ( -
-

{title}

-
- Read more on the  - - official documentation page - -
-
-
- - - - - - - -
-
- -
-
-
+
+

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + + + + + + + + + + + +
+
+ +
+
+
) } diff --git a/packages/cli/templates/react/igr-ts/grid/basic/index.ts b/packages/cli/templates/react/igr-ts/grid/basic/index.ts index d1950b131..c2ab5583d 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/index.ts +++ b/packages/cli/templates/react/igr-ts/grid/basic/index.ts @@ -15,8 +15,8 @@ class GridTemplate extends IgniteUIForReactTemplate { this.components = ["Grid"]; this.controlGroup = "Data Grids"; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-grids@~16.15.0", "igniteui-react-inputs@~16.15.0", - "igniteui-react-layouts@~16.15.0"]; + this.packages = ["igniteui-react-grids@18.2.2-beta.0", "igniteui-react-inputs@18.2.2-beta.0", + "igniteui-react-layouts@18.2.2-beta.0"]; this.hasExtraConfiguration = false; } diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json index 43d434645..9bd54427a 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json @@ -4,17 +4,19 @@ "private": true, "type": "module", "dependencies": { - "@testing-library/jest-dom": "^6.1.3", + "@testing-library/jest-dom": "^6.1.3", "@testing-library/react": "^14.0.0", "functions-have-names": "^1.2.3", + "igniteui-react": "18.2.2-beta.0", "igniteui-react-core": "18.2.2-beta.0", "react": "^18.2.0", "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", "react-router-dom": "5.3.4", - "react-native-get-random-values": "^1.9.0", + "react-native-get-random-values": "^1.9.0", "resize-observer-polyfill": "^1.5.1", - "vitest": "^0.34.4" + "vitest": "^0.34.4", + "igniteui-dockmanager": "^1.13.0" }, "devDependencies": { "@types/react": "^18.2.15", @@ -25,10 +27,10 @@ "eslint": "^8.46.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", - "jsdom": "^22.1.0", + "jsdom": "^22.1.0", "typescript": "^5.0.2", "vite": "^4.4.9", - "vitest-canvas-mock": "^0.3.3", + "vitest-canvas-mock": "^0.3.3", "igniteui-cli": "~$(cliVersion)" }, "scripts": { @@ -36,7 +38,7 @@ "build": "tsc && vite build", "preview": "vite preview", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "test": "vitest" + "test": "vitest" }, "eslintConfig": { "extends": "react-app" From 58a6e4809661ead1adffe6af1c12b461011f8739 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Thu, 28 Sep 2023 16:41:27 +0300 Subject: [PATCH 25/66] chore: release 12.0.6-beta.0 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index dba0a74f6..cac8ec129 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.0.6-alpha.1", + "version": "12.0.6-beta.0", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1206-alpha.1", - "@igniteui/cli-core": "~12.0.6-alpha.1", + "@igniteui/angular-templates": "~16.0.1206-beta.0", + "@igniteui/cli-core": "~12.0.6-beta.0", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index e815b3b77..370eda389 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.0.6-alpha.1", + "version": "12.0.6-beta.0", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index 3d441c7a7..d580d6dcd 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1206-alpha.1", + "version": "16.0.1206-beta.0", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.0.6-alpha.1", + "@igniteui/cli-core": "~12.0.6-beta.0", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 1a8521097..f717977da 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1206-alpha.1", + "version": "16.0.1206-beta.0", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1206-alpha.1", - "@igniteui/cli-core": "~12.0.6-alpha.1", + "@igniteui/angular-templates": "~16.0.1206-beta.0", + "@igniteui/cli-core": "~12.0.6-beta.0", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 6929287ee482d0a9f3203b55d08eb25c25864623 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 11:32:04 +0300 Subject: [PATCH 26/66] chore: add force to install commands --- packages/core/packages/PackageManager.ts | 4 ++-- spec/unit/packageManager-spec.ts | 18 +++++++++--------- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/packages/core/packages/PackageManager.ts b/packages/core/packages/PackageManager.ts index bab6378a2..c0c04c7ce 100644 --- a/packages/core/packages/PackageManager.ts +++ b/packages/core/packages/PackageManager.ts @@ -95,7 +95,7 @@ export class PackageManager { case "npm": /* passes through */ default: - command = `${managerCommand} install --quiet`; + command = `${managerCommand} install --force --quiet`; break; } await this.flushQueue(false); @@ -277,7 +277,7 @@ export class PackageManager { case "npm": /* passes through */ default: - return `${managerCommand} install ${packageName} --quiet --save`; + return `${managerCommand} install ${packageName} --force --quiet --save`; } } diff --git a/spec/unit/packageManager-spec.ts b/spec/unit/packageManager-spec.ts index ab4491c30..24fa9a237 100644 --- a/spec/unit/packageManager-spec.ts +++ b/spec/unit/packageManager-spec.ts @@ -223,7 +223,7 @@ describe("Unit - Package Manager", () => { await TestPackageManager.ensureIgniteUISource(true, mockTemplateMgr, true); expect(TestPackageManager.addPackage).toHaveBeenCalledWith(`@infragistics/ignite-ui-full@"~20.1"`, true); expect(Util.execSync).toHaveBeenCalledWith( - `npm install @infragistics/ignite-ui-full@"~20.1" --quiet --save`, + `npm install @infragistics/ignite-ui-full@"~20.1" --force --quiet --save`, jasmine.any(Object) ); expect(TestPackageManager.removePackage).toHaveBeenCalledWith("ignite-ui", true); @@ -232,7 +232,7 @@ describe("Unit - Package Manager", () => { await TestPackageManager.ensureIgniteUISource(true, mockTemplateMgr, true); expect(TestPackageManager.addPackage).toHaveBeenCalledWith(`@infragistics/ignite-ui-full@"^17.1"`, true); expect(Util.execSync).toHaveBeenCalledWith( - `npm install @infragistics/ignite-ui-full@"^17.1" --quiet --save`, + `npm install @infragistics/ignite-ui-full@"^17.1" --force --quiet --save`, jasmine.any(Object) ); @@ -240,7 +240,7 @@ describe("Unit - Package Manager", () => { await TestPackageManager.ensureIgniteUISource(true, mockTemplateMgr, true); expect(TestPackageManager.addPackage).toHaveBeenCalledWith(`@infragistics/ignite-ui-full@">=0.1.0 <0.2.0"`, true); expect(Util.execSync).toHaveBeenCalledWith( - `npm install @infragistics/ignite-ui-full@">=0.1.0 <0.2.0" --quiet --save`, + `npm install @infragistics/ignite-ui-full@">=0.1.0 <0.2.0" --force --quiet --save`, jasmine.any(Object) ); done(); @@ -263,7 +263,7 @@ describe("Unit - Package Manager", () => { expect(Util.log).toHaveBeenCalledWith(`Installing npm packages`); expect(Util.log).toHaveBeenCalledWith(`Error installing npm packages.`); expect(Util.log).toHaveBeenCalledWith(`Example`); - expect(Util.execSync).toHaveBeenCalledWith(`npm install --quiet`, + expect(Util.execSync).toHaveBeenCalledWith(`npm install --force --quiet`, { stdio: ["inherit"], killSignal: "SIGINT" }); expect(ProjectConfig.setConfig).toHaveBeenCalledWith({ packagesInstalled: true }); done(); @@ -280,7 +280,7 @@ describe("Unit - Package Manager", () => { expect(Util.log).toHaveBeenCalledTimes(2); expect(Util.log).toHaveBeenCalledWith(`Installing npm packages`); expect(Util.log).toHaveBeenCalledWith(`Packages installed successfully`); - expect(Util.execSync).toHaveBeenCalledWith(`npm install --quiet`, + expect(Util.execSync).toHaveBeenCalledWith(`npm install --force --quiet`, { stdio: ["inherit"], killSignal: "SIGINT" }); expect(ProjectConfig.setConfig).toHaveBeenCalledWith({ packagesInstalled: true }); done(); @@ -301,7 +301,7 @@ describe("Unit - Package Manager", () => { await PackageManager.installPackages(true); expect(Util.log).toHaveBeenCalledTimes(1); expect(Util.log).toHaveBeenCalledWith(`Installing npm packages`); - expect(Util.execSync).toHaveBeenCalledWith(`npm install --quiet`, + expect(Util.execSync).toHaveBeenCalledWith(`npm install --force --quiet`, { stdio: ["inherit"], killSignal: "SIGINT" }); expect(process.exit).toHaveBeenCalled(); expect(ProjectConfig.setConfig).toHaveBeenCalledTimes(0); @@ -345,7 +345,7 @@ describe("Unit - Package Manager", () => { expect(Util.log).toHaveBeenCalledWith(`Error installing package example-package with npm`); expect(Util.log).toHaveBeenCalledWith(`Error`); expect(Util.execSync).toHaveBeenCalledWith( - `npm install example-package --quiet --save`, { stdio: "pipe", encoding: "utf8" }); + `npm install example-package --force --quiet --save`, { stdio: "pipe", encoding: "utf8" }); done(); }); it("Should run addPackage properly without error code", async done => { @@ -355,7 +355,7 @@ describe("Unit - Package Manager", () => { expect(Util.log).toHaveBeenCalledTimes(1); expect(Util.log).toHaveBeenCalledWith(`Package example-package installed successfully`); expect(Util.execSync).toHaveBeenCalledWith( - `npm install example-package --quiet --save`, { stdio: "pipe", encoding: "utf8" }); + `npm install example-package --force --quiet --save`, { stdio: "pipe", encoding: "utf8" }); done(); }); @@ -380,7 +380,7 @@ describe("Unit - Package Manager", () => { expect(Util.log).toHaveBeenCalledTimes(0); expect(cp.exec).toHaveBeenCalledTimes(1); expect(cp.exec).toHaveBeenCalledWith( - `npm install test-pack --quiet --no-save`, {}, jasmine.any(Function)); + `npm install test-pack --force --quiet --no-save`, {}, jasmine.any(Function)); done(); }); From 8129ee7281463fc0f13bf733e2c93c113d5e9fc9 Mon Sep 17 00:00:00 2001 From: igdmdimitrov Date: Fri, 29 Sep 2023 11:33:28 +0300 Subject: [PATCH 27/66] feat(igr-ts): add deprecated to old react --- packages/cli/templates/react/igr-es6/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/templates/react/igr-es6/index.ts b/packages/cli/templates/react/igr-es6/index.ts index 471499607..a4c23d568 100644 --- a/packages/cli/templates/react/igr-es6/index.ts +++ b/packages/cli/templates/react/igr-es6/index.ts @@ -3,7 +3,7 @@ import { BaseProjectLibrary } from "@igniteui/cli-core"; class IgrReactProjectLibrary extends BaseProjectLibrary { constructor() { super(__dirname); - this.name = "Ignite UI for React"; + this.name = "Ignite UI for React (deprecated)"; this.projectType = "igr-es6"; this.themes = ["default"]; From 33bc0bec35a78ea97ed49415ed07fbdb74f91688 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 11:56:01 +0300 Subject: [PATCH 28/66] chore: remove serviceWorker --- .../igr-ts/projects/_base/files/src/main.tsx | 6 - .../_base/files/src/serviceWorker.tsx | 135 ------------------ 2 files changed, 141 deletions(-) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx index d368754b6..96b868a96 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx @@ -2,7 +2,6 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; -import * as serviceWorker from './serviceWorker'; import 'react-app-polyfill/ie11'; /** Required in IE11 for Charts */ @@ -16,8 +15,3 @@ ReactDOM.createRoot(document.getElementById('root')).render( ) - -// If you want your app to work offline and load faster, you can change -// unregister() to register() below. Note this comes with some pitfalls. -// Learn more about service workers: http://bit.ly/CRA-PWA -serviceWorker.unregister(); diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx deleted file mode 100644 index 2283ff9ce..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/serviceWorker.tsx +++ /dev/null @@ -1,135 +0,0 @@ -// This optional code is used to register a service worker. -// register() is not called by default. - -// This lets the app load faster on subsequent visits in production, and gives -// it offline capabilities. However, it also means that developers (and users) -// will only see deployed updates on subsequent visits to a page, after all the -// existing tabs open on the page have been closed, since previously cached -// resources are updated in the background. - -// To learn more about the benefits of this model and instructions on how to -// opt-in, read http://bit.ly/CRA-PWA - -const isLocalhost = Boolean( - window.location.hostname === 'localhost' || - // [::1] is the IPv6 localhost address. - window.location.hostname === '[::1]' || - // 127.0.0.1/8 is considered localhost for IPv4. - window.location.hostname.match( - /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ - ) -); - -export function register(config) { - if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { - // The URL constructor is available in all browsers that support SW. - const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href); - if (publicUrl.origin !== window.location.origin) { - // Our service worker won't work if PUBLIC_URL is on a different origin - // from what our page is served on. This might happen if a CDN is used to - // serve assets; see https://github.com/facebook/create-react-app/issues/2374 - return; - } - - window.addEventListener('load', () => { - const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; - - if (isLocalhost) { - // This is running on localhost. Let's check if a service worker still exists or not. - checkValidServiceWorker(swUrl, config); - - // Add some additional logging to localhost, pointing developers to the - // service worker/PWA documentation. - navigator.serviceWorker.ready.then(() => { - console.log( - 'This web app is being served cache-first by a service ' + - 'worker. To learn more, visit http://bit.ly/CRA-PWA' - ); - }); - } else { - // Is not localhost. Just register service worker - registerValidSW(swUrl, config); - } - }); - } -} - -function registerValidSW(swUrl, config) { - navigator.serviceWorker - .register(swUrl) - .then(registration => { - registration.onupdatefound = () => { - const installingWorker = registration.installing; - if (installingWorker == null) { - return; - } - installingWorker.onstatechange = () => { - if (installingWorker.state === 'installed') { - if (navigator.serviceWorker.controller) { - // At this point, the updated precached content has been fetched, - // but the previous service worker will still serve the older - // content until all client tabs are closed. - console.log( - 'New content is available and will be used when all ' + - 'tabs for this page are closed. See http://bit.ly/CRA-PWA.' - ); - - // Execute callback - if (config && config.onUpdate) { - config.onUpdate(registration); - } - } else { - // At this point, everything has been precached. - // It's the perfect time to display a - // "Content is cached for offline use." message. - console.log('Content is cached for offline use.'); - - // Execute callback - if (config && config.onSuccess) { - config.onSuccess(registration); - } - } - } - }; - }; - }) - .catch(error => { - console.error('Error during service worker registration:', error); - }); -} - -function checkValidServiceWorker(swUrl, config) { - // Check if the service worker can be found. If it can't reload the page. - fetch(swUrl) - .then(response => { - // Ensure service worker exists, and that we really are getting a JS file. - const contentType = response.headers.get('content-type'); - if ( - response.status === 404 || - (contentType != null && contentType.indexOf('javascript') === -1) - ) { - // No service worker found. Probably a different app. Reload the page. - navigator.serviceWorker.ready.then(registration => { - registration.unregister().then(() => { - window.location.reload(); - }); - }); - } else { - // Service worker found. Proceed as normal. - registerValidSW(swUrl, config); - } - }) - .catch(() => { - console.log( - 'No internet connection found. App is running in offline mode.' - ); - }); -} - -export function unregister() { - if ('serviceWorker' in navigator) { - navigator.serviceWorker.ready.then(registration => { - registration.unregister(); - }); - } -} From 9a1d6a7f1522de26d7455532f088e1c8b594d237 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 11:58:25 +0300 Subject: [PATCH 29/66] chore: update packages --- .../cli/templates/react/igr-ts/bullet-graph/default/index.ts | 2 +- .../cli/templates/react/igr-ts/category-chart/default/index.ts | 2 +- .../cli/templates/react/igr-ts/doughnut-chart/default/index.ts | 2 +- .../cli/templates/react/igr-ts/financial-chart/default/index.ts | 2 +- .../cli/templates/react/igr-ts/linear-gauge/default/index.ts | 2 +- packages/cli/templates/react/igr-ts/pie-chart/default/index.ts | 2 +- .../cli/templates/react/igr-ts/radial-gauge/default/index.ts | 2 +- 7 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts index ff16ef775..31b811a7e 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts @@ -10,7 +10,7 @@ class IgrTsBulletGraphTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Bullet Graph"; this.description = `allows for a linear and concise view of measures compared against a scale.`; - this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsBulletGraphTemplate(); diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts index 7828c0edc..2fe3e7b9e 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts @@ -11,7 +11,7 @@ class IgrTsCategoryChartTemplate extends IgniteUIForReactTemplate { this.name = "Category Chart"; this.description = `makes visualizing category data easy. Simplifies the complexities of the data visualization domain into manageable API`; - this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsCategoryChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts index 5ec2f48ea..b325afc92 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts @@ -10,7 +10,7 @@ class IgrTsDoughnutChartTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Doughnut Chart"; this.description = `proportionally illustrate the occurrences of variables.`; - this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsDoughnutChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts index d08a1e9b7..567d35b96 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts @@ -12,7 +12,7 @@ class IgrTsFinancialChartTemplate extends IgniteUIForReactTemplate { this.name = "Financial Chart"; this.description = `charting component that makes it easy to visualize financial data by using a simple and intuitive API.`; - this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsFinancialChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts index 25e3c9e25..ba346d073 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts @@ -10,7 +10,7 @@ class IgrTsLinearGaugeTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Linear Gauge"; this.description = `value compared against a scale and one or more ranges.`; - this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsLinearGaugeTemplate(); diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts index f0c62745f..fec2b6901 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts @@ -10,7 +10,7 @@ class IgrTsPieChartTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Pie Chart"; this.description = `easily illustate the proportions of data entries`; - this.packages = ["igniteui-react-charts@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsPieChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts index 2cabb7de4..26525eba2 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts @@ -11,7 +11,7 @@ class IgrTsRadialGaugeTemplate extends IgniteUIForReactTemplate { this.name = "Radial Gauge"; this.description = `provides a number of visual elements, like a needle, tick marks, ranges and labels, in order to create a predefined shape and scale.`; - this.packages = ["igniteui-react-gauges@~16.15.0"]; // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json } } module.exports = new IgrTsRadialGaugeTemplate(); From 0c1564cab8976d7a62ef0734a8bef82e96474f38 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 12:05:12 +0300 Subject: [PATCH 30/66] chore: formatting --- .../_base_with_home/files/src/App.tsx | 24 ++++++++----------- .../top-nav/files/src/views/home/index.tsx | 24 ++++++++----------- 2 files changed, 20 insertions(+), 28 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx index 5aee63035..f030af199 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx @@ -7,20 +7,16 @@ export default function App() { return (
{name}
-
- logo -

- Welcome to Ignite UI for React! -

- - Learn More - -
+
+ logo +

Welcome to Ignite UI for React!

+ + Learn More + +
) } diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx index 3424d4e2f..3b76aa0bc 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx @@ -4,19 +4,15 @@ import styles from './style.module.css'; export default function Home() { return ( -
- logo -

- Welcome to Ignite UI for React! -

- - Learn More - -
+
+ logo +

Welcome to Ignite UI for React!

+ + Learn More + +
) } From 38e154b2f6c8d8de2709f24a53038e0e0623e261 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 12:05:34 +0300 Subject: [PATCH 31/66] chore: remove asyncComponent --- .../_base/files/src/hoc/asyncComponent.tsx | 50 ------------------- 1 file changed, 50 deletions(-) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx deleted file mode 100644 index 560f734e4..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/hoc/asyncComponent.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import React, {Component} from 'react'; - -// https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html -const makeCancelable = (promise) => { - let hasCanceled_ = false; - - const wrappedPromise = new Promise((resolve, reject) => { - promise.then( - val => hasCanceled_ ? reject({isCanceled: true}) : resolve(val), - error => hasCanceled_ ? reject({isCanceled: true}) : reject(error) - ); - }); - - return { - promise: wrappedPromise, - cancel() { - hasCanceled_ = true; - }, - }; - }; - -/** - * https://medium.com/front-end-weekly/loading-components-asynchronously-in-react-app-with-an-hoc-61ca27c4fda7 - * @param {function} importComponent - */ -const asyncComponent = (importComponent) => { - return class extends Component { - state = { - component: null - } - - componentDidMount() { - this.op = makeCancelable(importComponent()); - this.op.promise.then(cmp => { - this.setState({component: cmp.default}); - }); - } - - componentWillUnmount() { - this.op.cancel(); - } - - render() { - const C = this.state.component; - return C ? : null; - } - } -}; - -export default asyncComponent; \ No newline at end of file From 1948f8bacfb422deac7bfd1df7451159913bc1c5 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 12:11:06 +0300 Subject: [PATCH 32/66] chore: fix lint --- .../cli/templates/react/igr-ts/bullet-graph/default/index.ts | 3 ++- .../cli/templates/react/igr-ts/category-chart/default/index.ts | 3 ++- .../cli/templates/react/igr-ts/doughnut-chart/default/index.ts | 3 ++- .../templates/react/igr-ts/financial-chart/default/index.ts | 3 ++- .../cli/templates/react/igr-ts/linear-gauge/default/index.ts | 3 ++- packages/cli/templates/react/igr-ts/pie-chart/default/index.ts | 3 ++- .../cli/templates/react/igr-ts/radial-gauge/default/index.ts | 3 ++- 7 files changed, 14 insertions(+), 7 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts index 31b811a7e..0348af73f 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts @@ -10,7 +10,8 @@ class IgrTsBulletGraphTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Bullet Graph"; this.description = `allows for a linear and concise view of measures compared against a scale.`; - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; } } module.exports = new IgrTsBulletGraphTemplate(); diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts index 2fe3e7b9e..87706ad6f 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts @@ -11,7 +11,8 @@ class IgrTsCategoryChartTemplate extends IgniteUIForReactTemplate { this.name = "Category Chart"; this.description = `makes visualizing category data easy. Simplifies the complexities of the data visualization domain into manageable API`; - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; } } module.exports = new IgrTsCategoryChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts index b325afc92..33e5665df 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts @@ -10,7 +10,8 @@ class IgrTsDoughnutChartTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Doughnut Chart"; this.description = `proportionally illustrate the occurrences of variables.`; - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; } } module.exports = new IgrTsDoughnutChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts index 567d35b96..3ab2f4f51 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts @@ -12,7 +12,8 @@ class IgrTsFinancialChartTemplate extends IgniteUIForReactTemplate { this.name = "Financial Chart"; this.description = `charting component that makes it easy to visualize financial data by using a simple and intuitive API.`; - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; } } module.exports = new IgrTsFinancialChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts index ba346d073..b5be018c9 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts @@ -10,7 +10,8 @@ class IgrTsLinearGaugeTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Linear Gauge"; this.description = `value compared against a scale and one or more ranges.`; - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; } } module.exports = new IgrTsLinearGaugeTemplate(); diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts index fec2b6901..144f2215b 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts @@ -10,7 +10,8 @@ class IgrTsPieChartTemplate extends IgniteUIForReactTemplate { this.projectType = "igr-ts"; this.name = "Pie Chart"; this.description = `easily illustate the proportions of data entries`; - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; } } module.exports = new IgrTsPieChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts index 26525eba2..a968cd874 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts @@ -11,7 +11,8 @@ class IgrTsRadialGaugeTemplate extends IgniteUIForReactTemplate { this.name = "Radial Gauge"; this.description = `provides a number of visual elements, like a needle, tick marks, ranges and labels, in order to create a predefined shape and scale.`; - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; // TODO: read version from igniteui-react-core in package.json + // TODO: read version from igniteui-react-core in package.json + this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; } } module.exports = new IgrTsRadialGaugeTemplate(); From c027564a8093560cf717d39e87acae859dacc20c Mon Sep 17 00:00:00 2001 From: IBarakov Date: Fri, 29 Sep 2023 12:15:45 +0300 Subject: [PATCH 33/66] chore: add asyncComponent to top-nav --- .../top-nav/files/src/hoc/asyncComponent.tsx | 50 +++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx new file mode 100644 index 000000000..560f734e4 --- /dev/null +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx @@ -0,0 +1,50 @@ +import React, {Component} from 'react'; + +// https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html +const makeCancelable = (promise) => { + let hasCanceled_ = false; + + const wrappedPromise = new Promise((resolve, reject) => { + promise.then( + val => hasCanceled_ ? reject({isCanceled: true}) : resolve(val), + error => hasCanceled_ ? reject({isCanceled: true}) : reject(error) + ); + }); + + return { + promise: wrappedPromise, + cancel() { + hasCanceled_ = true; + }, + }; + }; + +/** + * https://medium.com/front-end-weekly/loading-components-asynchronously-in-react-app-with-an-hoc-61ca27c4fda7 + * @param {function} importComponent + */ +const asyncComponent = (importComponent) => { + return class extends Component { + state = { + component: null + } + + componentDidMount() { + this.op = makeCancelable(importComponent()); + this.op.promise.then(cmp => { + this.setState({component: cmp.default}); + }); + } + + componentWillUnmount() { + this.op.cancel(); + } + + render() { + const C = this.state.component; + return C ? : null; + } + } +}; + +export default asyncComponent; \ No newline at end of file From b70870850d66e336ad214ae693ac84e0f97d8e7d Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 16:28:17 +0300 Subject: [PATCH 34/66] chore: remove unused imports --- .../templates/react/igr-ts/projects/_base/files/src/App.tsx | 5 ++--- .../react/igr-ts/projects/_base_with_home/files/src/App.tsx | 1 - .../react/igr-ts/projects/top-nav/files/src/App.tsx | 1 - 3 files changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx index c13d04faf..2421b1534 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx @@ -1,11 +1,10 @@ -import React from 'react'; -import { BrowserRouter as Router } from "react-router-dom"; +import { BrowserRouter } from "react-router-dom"; export default function App() { return (
- +
) } diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx index f030af199..60a05e762 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import logo from '/logo.svg'; import styles from './App.module.css'; diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx index 2e575a27a..ca2f11432 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { Route, BrowserRouter as Router, Switch } from "react-router-dom"; import asyncComponent from "./hoc/asyncComponent"; import NavigationHeader from "./components/navigation-header/index"; From cc8c8d6a23727b1ef276e00cbf4ef2a81c00eec6 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 16:28:54 +0300 Subject: [PATCH 35/66] fix: search for empty template insted of first one --- packages/cli/lib/commands/new.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/new.ts b/packages/cli/lib/commands/new.ts index 63408f8ae..f9e5586f6 100644 --- a/packages/cli/lib/commands/new.ts +++ b/packages/cli/lib/commands/new.ts @@ -109,7 +109,8 @@ command = { const theme = projectLib.themes[themeIndex]; - const projectTemplate = argv.template || projectLib.projectIds[0]; + const indexOfEmptyOrFirst = projectLib.projectIds.indexOf("empty") !== -1 ? projectLib.projectIds.indexOf("empty") : 0; + const projectTemplate = argv.template || projectLib.projectIds[indexOfEmptyOrFirst]; Util.log(`Project Name: ${argv.name}, framework ${argv.framework}, type ${projectLib.projectType}, theme ${theme}`); const projTemplate = projectLib.getProject(projectTemplate); if (projTemplate == null) { From 69921211ab6be0d0b0bb9e5f884bdb3ac1f17fad Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 16:32:39 +0300 Subject: [PATCH 36/66] chore: fix lint --- packages/cli/lib/commands/new.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/new.ts b/packages/cli/lib/commands/new.ts index f9e5586f6..5049fa929 100644 --- a/packages/cli/lib/commands/new.ts +++ b/packages/cli/lib/commands/new.ts @@ -109,7 +109,10 @@ command = { const theme = projectLib.themes[themeIndex]; - const indexOfEmptyOrFirst = projectLib.projectIds.indexOf("empty") !== -1 ? projectLib.projectIds.indexOf("empty") : 0; + const indexOfEmptyOrFirst = projectLib.projectIds.indexOf("empty") !== -1 ? + projectLib.projectIds.indexOf("empty") : + 0; + const projectTemplate = argv.template || projectLib.projectIds[indexOfEmptyOrFirst]; Util.log(`Project Name: ${argv.name}, framework ${argv.framework}, type ${projectLib.projectType}, theme ${theme}`); const projTemplate = projectLib.getProject(projectTemplate); From 6c1b7c584ea30eb3f8131c925874e03a4de4b997 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 16:40:09 +0300 Subject: [PATCH 37/66] chore: unused import --- .../react/igr-ts/projects/top-nav/files/src/views/home/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx index 3b76aa0bc..91037fa0c 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import logo from './logo.svg'; import styles from './style.module.css'; From 5594c547dcb75136ccb97582d38fe72d7c0118e8 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 16:55:07 +0300 Subject: [PATCH 38/66] chore: unused imports --- .../files/src/components/navigation-header/index.tsx | 6 +++--- .../projects/top-nav/files/src/hoc/asyncComponent.tsx | 10 +++++----- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx index 4eecfd6d4..d00860385 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import { useState, useEffect } from 'react'; import { NavLink } from 'react-router-dom'; export default function NavigationHeader({ routes }) { @@ -16,7 +16,7 @@ export default function NavigationHeader({ routes }) { const activeItem = routes.findIndex((route) => route.path === currentRoute); setState({ activeItem }); }, [routes]); - + return ( ) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx index 560f734e4..17f1f81e2 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx @@ -1,16 +1,16 @@ -import React, {Component} from 'react'; +import { Component } from 'react'; // https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html const makeCancelable = (promise) => { let hasCanceled_ = false; - + const wrappedPromise = new Promise((resolve, reject) => { promise.then( val => hasCanceled_ ? reject({isCanceled: true}) : resolve(val), error => hasCanceled_ ? reject({isCanceled: true}) : reject(error) ); }); - + return { promise: wrappedPromise, cancel() { @@ -21,7 +21,7 @@ const makeCancelable = (promise) => { /** * https://medium.com/front-end-weekly/loading-components-asynchronously-in-react-app-with-an-hoc-61ca27c4fda7 - * @param {function} importComponent + * @param {function} importComponent */ const asyncComponent = (importComponent) => { return class extends Component { @@ -47,4 +47,4 @@ const asyncComponent = (importComponent) => { } }; -export default asyncComponent; \ No newline at end of file +export default asyncComponent; From 6c560ccd088fd375c0b2f9885bd96bd1742b02a1 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Mon, 2 Oct 2023 17:01:12 +0300 Subject: [PATCH 39/66] chore: release v12.0.6-beta.1 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index cac8ec129..2b0c3ec1f 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.0.6-beta.0", + "version": "12.0.6-beta.1", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1206-beta.0", - "@igniteui/cli-core": "~12.0.6-beta.0", + "@igniteui/angular-templates": "~16.0.1206-beta.1", + "@igniteui/cli-core": "~12.0.6-beta.1", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 370eda389..54da9bd7b 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.0.6-beta.0", + "version": "12.0.6-beta.1", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index d580d6dcd..090aa6eb4 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1206-beta.0", + "version": "16.0.1206-beta.1", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.0.6-beta.0", + "@igniteui/cli-core": "~12.0.6-beta.1", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index f717977da..0525d5ae1 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1206-beta.0", + "version": "16.0.1206-beta.1", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1206-beta.0", - "@igniteui/cli-core": "~12.0.6-beta.0", + "@igniteui/angular-templates": "~16.0.1206-beta.1", + "@igniteui/cli-core": "~12.0.6-beta.1", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 5b67e485f32dfbc7bf1bcbc5de47a9d6c3705c75 Mon Sep 17 00:00:00 2001 From: lipata Date: Mon, 2 Oct 2023 18:08:44 +0300 Subject: [PATCH 40/66] release: 12.1.0-beta.0 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index cb9ca1c59..7a58c0f16 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.0.6", + "version": "12.1.0-beta.0", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1206", - "@igniteui/cli-core": "~12.0.6", + "@igniteui/angular-templates": "~16.0.1210-beta.0", + "@igniteui/cli-core": "~12.1.0-beta.0", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 949b05d1c..68fbe79e6 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.0.6", + "version": "12.1.0-beta.0", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index 9e71b2d58..247abc3a2 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1206", + "version": "16.0.1210-beta.0", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.0.6", + "@igniteui/cli-core": "~12.1.0-beta.0", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 3d7a1c49f..3b7e4ac76 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1206", + "version": "16.0.1210-beta.0", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1206", - "@igniteui/cli-core": "~12.0.6", + "@igniteui/angular-templates": "~16.0.1210-beta.0", + "@igniteui/cli-core": "~12.1.0-beta.0", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 400122c072461dd4a926b36d013973c09d294344 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 4 Oct 2023 16:05:14 +0300 Subject: [PATCH 41/66] chore: set default port #1153 --- packages/cli/lib/commands/start.ts | 16 ++++++++++------ .../igr-ts/projects/_base/files/vite.config.ts | 3 +++ 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/packages/cli/lib/commands/start.ts b/packages/cli/lib/commands/start.ts index 1b3b9b6fc..7652fb260 100644 --- a/packages/cli/lib/commands/start.ts +++ b/packages/cli/lib/commands/start.ts @@ -84,12 +84,16 @@ command = { break; case "react": if (port) { - // https://facebook.github.io/create-react-app/docs/advanced-configuration - // react-scripts start "--port=dafaultPort" is not a valid command for all environments. - // .env file is included and used by both igr-es6 and es6 now, - // to specify the port for all environments (Windows, Mac, etc) - process.env.PORT = `${port}`; - port = null; + if (projectType === 'igr-ts') { + execSyncNpmStart(port, options); + } else { + // https://facebook.github.io/create-react-app/docs/advanced-configuration + // react-scripts start "--port=dafaultPort" is not a valid command for all environments. + // .env file is included and used by both igr-es6 and es6 now, + // to specify the port for all environments (Windows, Mac, etc) + process.env.PORT = `${port}`; + port = null; + } } /* falls through */ case "angular": diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts index 1e885b690..4443712a3 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/vite.config.ts @@ -16,5 +16,8 @@ export default defineConfig({ }, resolve: { mainFields: ['module'], + }, + server: { + port: 3003 } }) From 1da2943a6fba79d7c660075862f94fefb1951d67 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 4 Oct 2023 16:15:49 +0300 Subject: [PATCH 42/66] chore: fix lint and remove .env file --- packages/cli/lib/commands/start.ts | 2 +- .../cli/templates/react/igr-ts/projects/_base/files/README.md | 2 +- .../cli/templates/react/igr-ts/projects/_base/files/__dot__env | 1 - 3 files changed, 2 insertions(+), 3 deletions(-) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env diff --git a/packages/cli/lib/commands/start.ts b/packages/cli/lib/commands/start.ts index 7652fb260..691fd22d4 100644 --- a/packages/cli/lib/commands/start.ts +++ b/packages/cli/lib/commands/start.ts @@ -84,7 +84,7 @@ command = { break; case "react": if (port) { - if (projectType === 'igr-ts') { + if (projectType === "igr-ts") { execSyncNpmStart(port, options); } else { // https://facebook.github.io/create-react-app/docs/advanced-configuration diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/README.md b/packages/cli/templates/react/igr-ts/projects/_base/files/README.md index 2a81595a4..dbf5fb8d1 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/README.md +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/README.md @@ -6,7 +6,7 @@ The template builds upon a project bootstrapped with [Vite](https://vitejs.dev/) ## Development server Run `ig start` to build the application, start a web server and open the application in the default browser.
-The default serving port is `http://localhost:3003/`. Default serving port can be configured in `.env` via `PORT` property. +The default serving port is `http://localhost:3003/`. Default serving port can be configured in `ignite-ui-cli.json` via `defaultProp` property. ## Build diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env deleted file mode 100644 index fe690d592..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__env +++ /dev/null @@ -1 +0,0 @@ -PORT=3003 From 14a2caa140e74f1c2a414d1457623370b6e8c2f0 Mon Sep 17 00:00:00 2001 From: IBarakov Date: Wed, 4 Oct 2023 16:20:15 +0300 Subject: [PATCH 43/66] chore: remove unused imports --- .../bullet-graph/default/files/src/views/__path__/index.tsx | 1 - .../default/files/src/views/__path__/index.tsx | 2 +- .../default/files/src/views/__path__/index.tsx | 2 +- .../default/files/src/views/__path__/index.tsx | 2 +- .../igr-ts/grid/basic/files/src/views/__path__/index.tsx | 1 - .../linear-gauge/default/files/src/views/__path__/index.tsx | 1 - .../pie-chart/default/files/src/views/__path__/index.tsx | 2 +- .../radial-gauge/default/files/src/views/__path__/index.tsx | 5 ++--- 8 files changed, 6 insertions(+), 10 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx index 498e424d3..e85d14f08 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import { IgrBulletGraphModule } from 'igniteui-react-gauges'; import { IgrBulletGraph } from 'igniteui-react-gauges'; import style from './style.module.css'; diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx index 67771db02..ae79409c0 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import { useEffect, useState } from 'react'; import { IgrCategoryChartModule } from 'igniteui-react-charts'; import { IgrCategoryChart } from 'igniteui-react-charts'; import style from './style.module.css'; diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx index a35b60488..e2943ebc9 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { IgrDoughnutChartModule } from 'igniteui-react-charts'; import { IgrDoughnutChart } from 'igniteui-react-charts'; import { IgrRingSeriesModule } from 'igniteui-react-charts'; diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx index ac4a52f1b..52d02b2e7 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react' +import { useEffect, useState } from 'react' import { IgrFinancialChartModule } from 'igniteui-react-charts'; import { IgrFinancialChart } from 'igniteui-react-charts'; import style from './style.module.css'; diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx index b7bd81280..58aa4c27f 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx @@ -1,4 +1,3 @@ -import { React } from 'react'; import style from './style.module.css'; import 'igniteui-react-grids/grids'; import { IgrGridModule, IgrGrid, IgrColumn } from 'igniteui-react-grids'; diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx index 69c497c33..7d4d909c5 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import style from './style.module.css'; import { IgrLinearGaugeModule } from 'igniteui-react-gauges'; import { IgrLinearGauge } from 'igniteui-react-gauges'; diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx index 2cbe6d342..9a42c847f 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { IgrPieChartModule } from 'igniteui-react-charts'; import { IgrPieChart } from 'igniteui-react-charts'; import { IgrItemLegend } from 'igniteui-react-charts'; diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx index eeadf8233..1a8fe0f48 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import { IgrRadialGaugeModule } from 'igniteui-react-gauges'; import { IgrRadialGauge } from 'igniteui-react-gauges'; import style from './style.module.css'; @@ -16,7 +15,7 @@ export default function $(ClassName)() { Read more on the  official documentation page - +
@@ -58,4 +57,4 @@ export default function $(ClassName)() {
) -} \ No newline at end of file +} From 524e1748e81ddaea2dd49750b03199508ffd0970 Mon Sep 17 00:00:00 2001 From: "INFRAGISTICS\\IBarakov" Date: Wed, 11 Oct 2023 16:01:07 +0300 Subject: [PATCH 44/66] feat: upgrade to react router 6 --- .../lib/templates/IgniteUIForReactTemplate.ts | 21 +- .../react/ReactTypeScriptFileUpdate.ts | 432 ++++++++++++++++++ .../igr-ts/projects/_base/files/package.json | 2 +- .../igr-ts/projects/_base/files/src/main.tsx | 5 +- .../projects/_base/files/src/routes.json | 3 - .../projects/_base/files/src/routes.tsx | 3 + .../igr-ts/projects/top-nav/files/src/App.tsx | 38 +- .../components/navigation-header/index.tsx | 4 +- .../top-nav/files/src/hoc/asyncComponent.tsx | 50 -- .../projects/top-nav/files/src/routes.json | 7 - .../projects/top-nav/files/src/routes.tsx | 5 + 11 files changed, 473 insertions(+), 97 deletions(-) create mode 100644 packages/cli/templates/react/ReactTypeScriptFileUpdate.ts delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json create mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json create mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 47cc6f193..8da092090 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -1,5 +1,6 @@ import { AddTemplateArgs, ControlExtraConfiguration, defaultDelimiters, Template, Util } from "@igniteui/cli-core"; import * as fs from "fs-extra"; +import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; import * as path from "path"; export class IgniteUIForReactTemplate implements Template { @@ -19,7 +20,7 @@ export class IgniteUIForReactTemplate implements Template { // non-standard template prop protected widget: string; - private configFile: string = "./src/routes.json"; + private configFile: string = "./src/routes.tsx"; /** * Base ReactTemplate constructor @@ -56,15 +57,17 @@ export class IgniteUIForReactTemplate implements Template { if (options && options.skipRoute) { return; } - const configFile = fs.readFileSync(path.join(projectPath, this.configFile), "utf8"); - const viewsArr = JSON.parse(configFile); - viewsArr.push({ - componentPath: this.getViewLink(name), - path: "/" + this.folderName(Util.nameFromPath(name)), - text: this.getToolbarLink(name) - }); - fs.writeFileSync(path.join(projectPath, this.configFile), JSON.stringify(viewsArr, null, 4)); + const routeModulePath: string = 'src/routes.tsx'; + const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); + + routingModule.addRoute( + path.join(projectPath, `src/views/${this.folderName(name)}`), + Util.lowerDashed(Util.nameFromPath(name)), + Util.className(Util.nameFromPath(name)), + options.routerChildren, + undefined + ); } public getExtraConfiguration(): ControlExtraConfiguration[] { throw new Error("Method not implemented."); diff --git a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts new file mode 100644 index 000000000..8d38ed4a6 --- /dev/null +++ b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts @@ -0,0 +1,432 @@ +import { App, FS_TOKEN, IFileSystem, TypeScriptUtils, Util } from "@igniteui/cli-core"; +import * as ts from "typescript"; + +const DEFAULT_ROUTES_VARIABLE = "routes"; +/** + * Apply various updates to typescript files using AST + */ +export class ReactTypeScriptFileUpdate { + + protected formatOptions = { spaces: false, indentSize: 4, singleQuotes: false }; + private fileSystem: IFileSystem; + private targetSource: ts.SourceFile; + private importsMeta: { lastIndex: number, modulePaths: string[] }; + + private requestedImports: Array<{ as: string | undefined, from: string, component: string, edit: boolean }>; + + private createdStringLiterals: string[]; + + /** Create updates for a file. Use `add` methods to add transformations and `finalize` to apply and save them. */ + constructor(private targetPath: string) { + this.fileSystem = App.container.get(FS_TOKEN); + this.initState(); + } + + /** Applies accumulated transforms, saves and formats the file */ + public finalize() { + // add new import statements after visitor walks: + this.addNewFileImports(); + + TypeScriptUtils.saveFile(this.targetPath, this.targetSource); + this.formatFile(this.targetPath); + // reset state in case of further updates + this.initState(); + } + + public addRoute( + path: string, + component: string, + name: string, + routerChildren: string, + importAlias: string, + routesVariable = DEFAULT_ROUTES_VARIABLE + ) { + this.addRouteModuleEntry(path, component, name, routerChildren, importAlias, routesVariable); + } + + //#region File state + + /** Initializes existing imports info, [re]sets import and `NgModule` edits */ + protected initState() { + this.targetSource = TypeScriptUtils.getFileSource(this.targetPath); + this.importsMeta = this.loadImportsMeta(); + this.requestedImports = []; + this.createdStringLiterals = []; + } + + /* load some metadata about imports */ + protected loadImportsMeta() { + const meta = { lastIndex: 0, modulePaths: [] }; + + for (let i = 0; i < this.targetSource.statements.length; i++) { + const statement = this.targetSource.statements[i]; + switch (statement.kind) { + case ts.SyntaxKind.ImportDeclaration: + const importStmt = (statement as ts.ImportDeclaration); + + if (importStmt.importClause && importStmt.importClause.namedBindings && + importStmt.importClause.namedBindings.kind !== ts.SyntaxKind.NamespaceImport) { + // don't add imports without named (e.g. `import $ from "JQuery"` or `import "./my-module.js";`) + // don't add namespace imports (`import * as fs`) as available for editing, maybe in the future + meta.modulePaths.push((importStmt.moduleSpecifier as ts.StringLiteral).text); + } + + // don't add equals imports (`import url = require("url")`) as available for editing, maybe in the future + case ts.SyntaxKind.ImportEqualsDeclaration: + meta.lastIndex = i + 1; + break; + default: + break; + } + } + + return meta; + } + + //#endregion File state + + protected addRouteModuleEntry( + path: string, + component: string, + name: string, + routerChildren: string, + importAlias: string, + routesVariable = DEFAULT_ROUTES_VARIABLE + ) { + const isRouting: boolean = path.indexOf("routing") >= 0; + + if (isRouting && this.targetSource.text.indexOf(path.slice(0, -3)) > 0) { + return; + } + + const moduleName = path.substring(0, path.indexOf("-routing")); + if (path) { + const relativePath: string = isRouting ? + "./views/" + moduleName + "/" + path.slice(0, -3) : Util.relativePath(this.targetPath, path, true, true); + + this.requestImport(relativePath, importAlias, name); + } + + // https://github.com/Microsoft/TypeScript/issues/14419#issuecomment-307256171 + const transformer: ts.TransformerFactory = (context: ts.TransformationContext) => + (rootNode: T) => { + // the visitor that should be used when adding routes to the main route array + const conditionalVisitor: ts.Visitor = (node: ts.Node): ts.Node => { + if (node.kind === ts.SyntaxKind.ArrayLiteralExpression) { + const newObject = this.createRouteEntry(component, name, routerChildren); + const array = (node as ts.ArrayLiteralExpression); + this.createdStringLiterals.push(path, name); + const notFoundWildCard = ".*"; + const nodes = ts.visitNodes(array.elements, visitor); + const errorRouteNode = nodes.filter(element => element.getText().includes(notFoundWildCard))[0]; + let resultNodes = null; + if (errorRouteNode) { + resultNodes = nodes + .slice(0, nodes.indexOf(errorRouteNode)) + .concat(newObject) + .concat(errorRouteNode); + } else { + resultNodes = nodes + .concat(newObject); + } + + const elements = ts.factory.createNodeArray([ + ...resultNodes + ]); + + return ts.factory.updateArrayLiteralExpression(array, elements); + } else { + return ts.visitEachChild(node, conditionalVisitor, context); + } + }; + + let visitCondition; + + if (!isRouting) { + visitCondition = (node: ts.Node): boolean => { + return node.kind === ts.SyntaxKind.VariableDeclaration && + (node as ts.VariableDeclaration).name.getText() === routesVariable; + // no type currently + //(node as ts.VariableDeclaration).type.getText() === "Route[]"; + }; + } else { + visitCondition = (node: ts.Node): boolean => { + return undefined; + }; + } + + const visitor: ts.Visitor = this.createVisitor(conditionalVisitor, visitCondition, context); + context.enableSubstitution(ts.SyntaxKind.ClassDeclaration); + return ts.visitNode(rootNode, visitor); + }; + + this.targetSource = ts.transform(this.targetSource, [transformer], { + pretty: true // oh well.. + }).transformed[0] as ts.SourceFile; + + this.finalize(); + } + + protected requestImport(modulePath: string, routerAlias: string, componentName: string) { + const existing = this.requestedImports.find(x => x.from === modulePath); + if (!existing) { + // new imports, check if already exists in file + this.requestedImports.push({ + as: routerAlias, + from: modulePath, + component: componentName, + edit: this.importsMeta.modulePaths.indexOf(modulePath) !== -1 + }); + } else { + return; + } + } + + /** Add `import` statements not previously found in the file */ + protected addNewFileImports() { + const newImports = this.requestedImports.filter(x => !x.edit); + if (!newImports.length) { + return; + } + + const newStatements = ts.factory.createNodeArray([ + ...this.targetSource.statements.slice(0, this.importsMeta.lastIndex), + ...newImports.map(x => this.createIdentifierImport(x.from, x.as, x.component)), + ...this.targetSource.statements.slice(this.importsMeta.lastIndex) + ]); + newImports.forEach(x => this.createdStringLiterals.push(x.from)); + + this.targetSource = ts.factory.updateSourceFile(this.targetSource, newStatements); + } + + protected createIdentifierImport(importPath: string, as: string, component: string): ts.ImportDeclaration { + let exportedObject: string | undefined; + let exportedObjectName: string | undefined; + let importClause: ts.ImportClause | undefined; + if (as) { + exportedObject = "routes"; + exportedObjectName = as.replace(/\s/g, ""); + importClause = ts.factory.createImportClause( + false, + undefined, + ts.factory.createNamedImports([ + ts.factory.createImportSpecifier(false, ts.factory.createIdentifier(exportedObject), + ts.factory.createIdentifier(exportedObjectName)) + ]) + ); + } else { + importClause = ts.factory.createImportClause( + false, + ts.factory.createIdentifier(component), + undefined + ); + } + const importDeclaration = ts.factory.createImportDeclaration( + undefined, + undefined, + importClause, + ts.factory.createStringLiteral(importPath, true)); + return importDeclaration; + } + + //#region ts.TransformerFactory + + /** Transformation to apply edits to existing named import declarations */ + protected importsTransformer: ts.TransformerFactory = + (context: ts.TransformationContext) => (rootNode: T) => { + const editImports = this.requestedImports.filter(x => x.edit); + + // https://github.com/Microsoft/TypeScript/issues/14419#issuecomment-307256171 + const visitor = (node: ts.Node): ts.Node => { + if (node.kind === ts.SyntaxKind.ImportDeclaration && + editImports.find(x => x.from === ((node as ts.ImportDeclaration).moduleSpecifier as ts.StringLiteral).text) + ) { + // visit just the source file main array (second visit) + return visitImport(node as ts.ImportDeclaration); + } else { + node = ts.visitEachChild(node, visitor, context); + } + return node; + }; + function visitImport(node: ts.Node) { + node = ts.visitEachChild(node, visitImport, context); + return node; + } + return ts.visitNode(rootNode, visitor); + } + + //#endregion ts.TransformerFactory + + //#region Formatting + + /** Format a TS source file, very TBD */ + protected formatFile(filePath: string) { + // formatting via LanguageService https://github.com/Microsoft/TypeScript/wiki/Using-the-Compiler-API + // https://github.com/Microsoft/TypeScript/issues/1651 + + let text = this.fileSystem.readFile(filePath); + // create the language service files + const services = ts.createLanguageService(this.getLanguageHost(filePath), ts.createDocumentRegistry()); + + this.readFormatConfigs(); + const textChanges = services.getFormattingEditsForDocument(filePath, this.getFormattingOptions()); + text = this.applyChanges(text, textChanges); + + if (this.formatOptions.singleQuotes) { + for (const str of this.createdStringLiterals) { + // there shouldn't be duplicate strings of these + text = text.replace(`"${str}"`, `'${str}'`); + } + } + + this.fileSystem.writeFile(filePath, text); + } + + /** Try and parse formatting from project `.editorconfig` / `tslint.json` */ + protected readFormatConfigs() { + if (this.fileSystem.fileExists(".editorconfig")) { + // very basic parsing support + const text = this.fileSystem.readFile(".editorconfig", "utf-8"); + const options = text + .replace(/\s*[#;].*([\r\n])/g, "$1") //remove comments + .replace(/\[(?!\*\]|\*.ts).+\][^\[]+/g, "") // leave [*]/[*.ts] sections + .split(/\r\n|\r|\n/) + .reduce((obj, x) => { + if (x.indexOf("=") !== -1) { + const pair = x.split("="); + obj[pair[0].trim()] = pair[1].trim(); + } + return obj; + }, {}); + + this.formatOptions.spaces = options["indent_style"] === "space"; + if (options["indent_size"]) { + this.formatOptions.indentSize = parseInt(options["indent_size"], 10) || this.formatOptions.indentSize; + } + + if (options["quote_type"]) { + this.formatOptions.singleQuotes = options["quote_type"] === "single"; + } + } + if (this.fileSystem.fileExists("tslint.json")) { + // tslint prio - overrides other settings + const options = JSON.parse(this.fileSystem.readFile("tslint.json", "utf-8")); + if (options.rules && options.rules.indent && options.rules.indent[0]) { + this.formatOptions.spaces = options.rules.indent[1] === "spaces"; + if (options.rules.indent[2]) { + this.formatOptions.indentSize = parseInt(options.rules.indent[2], 10); + } + } + if (options.rules && options.rules.quotemark && options.rules.quotemark[0]) { + this.formatOptions.singleQuotes = options.rules.quotemark.indexOf("single") !== -1; + } + } + } + + /** + * Apply formatting changes (position based) in reverse + * from https://github.com/Microsoft/TypeScript/issues/1651#issuecomment-69877863 + */ + private applyChanges(orig: string, changes: ts.TextChange[]): string { + let result = orig; + for (let i = changes.length - 1; i >= 0; i--) { + const change = changes[i]; + const head = result.slice(0, change.span.start); + const tail = result.slice(change.span.start + change.span.length); + result = head + change.newText + tail; + } + return result; + } + + /** Return source file formatting options */ + private getFormattingOptions(): ts.FormatCodeSettings { + const formatOptions: ts.FormatCodeSettings = { + // tslint:disable:object-literal-sort-keys + indentSize: this.formatOptions.indentSize, + tabSize: 4, + newLineCharacter: ts.sys.newLine, + convertTabsToSpaces: this.formatOptions.spaces, + indentStyle: ts.IndentStyle.Smart, + insertSpaceAfterCommaDelimiter: true, + insertSpaceAfterSemicolonInForStatements: true, + insertSpaceBeforeAndAfterBinaryOperators: true, + insertSpaceAfterKeywordsInControlFlowStatements: true, + insertSpaceAfterTypeAssertion: true + // tslint:enable:object-literal-sort-keys + }; + + return formatOptions; + } + + /** Get language service host, sloppily */ + private getLanguageHost(filePath: string): ts.LanguageServiceHost { + const files = {}; + files[filePath] = { version: 0 }; + // create the language service host to allow the LS to communicate with the host + const servicesHost: ts.LanguageServiceHost = { + getCompilationSettings: () => ({}), + getScriptFileNames: () => Object.keys(files), + getScriptVersion: fileName => files[fileName] && files[fileName].version.toString(), + getScriptSnapshot: fileName => { + if (!this.fileSystem.fileExists(fileName)) { + return undefined; + } + return ts.ScriptSnapshot.fromString(this.fileSystem.readFile(fileName)); + }, + getCurrentDirectory: () => process.cwd(), + getDefaultLibFileName: options => ts.getDefaultLibFilePath(options), + readDirectory: ts.sys.readDirectory, + readFile: ts.sys.readFile, + fileExists: ts.sys.fileExists + }; + return servicesHost; + } + + //#endregion Formatting + + /** Convert a string or string array union to array. Splits strings as comma delimited */ + private asArray(value: string | string[], variables: { [key: string]: string }): string[] { + let result: string[] = []; + if (value) { + result = typeof value === "string" ? value.split(/\s*,\s*/) : value; + result = result.map(x => Util.applyConfigTransformation(x, variables)); + } + return result; + } + + private createVisitor( + conditionalVisitor: ts.Visitor, + visitCondition: (node: ts.Node) => boolean, + nodeContext: ts.TransformationContext + ): ts.Visitor { + return function visitor(node: ts.Node): ts.Node { + if (visitCondition(node)) { + node = ts.visitEachChild(node, conditionalVisitor, nodeContext); + } else { + node = ts.visitEachChild(node, visitor, nodeContext); + } + return node; + }; + } + + private createRouteEntry( + className: string, + linkText: string, + routerAlias: string + ): ts.ObjectLiteralExpression { + const routePath = ts.factory.createPropertyAssignment("path", ts.factory.createStringLiteral(className, true)); + const jsxElement = ts.factory.createJsxSelfClosingElement( + ts.factory.createIdentifier(linkText), [], undefined + ); + + const routeComponent = + ts.factory.createPropertyAssignment("element", jsxElement); + const routeData = ts.factory.createPropertyAssignment("text", ts.factory.createStringLiteral(linkText, true)); + if (routerAlias) { + const childrenData = ts.factory.createPropertyAssignment("children", ts.factory.createIdentifier(routerAlias)); + return ts.factory.createObjectLiteralExpression([routePath, routeComponent, routeData, childrenData]); + } else { + return ts.factory.createObjectLiteralExpression([routePath, routeComponent, routeData]); + } + } +} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json index 9bd54427a..8113c69b2 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json @@ -12,7 +12,7 @@ "react": "^18.2.0", "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", - "react-router-dom": "5.3.4", + "react-router-dom": "^6.16.0", "react-native-get-random-values": "^1.9.0", "resize-observer-polyfill": "^1.5.1", "vitest": "^0.34.4", diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx index 96b868a96..0c57d2874 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx @@ -1,5 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; +import { BrowserRouter as Router } from 'react-router-dom'; import './index.css'; import App from './App'; import 'react-app-polyfill/ie11'; @@ -12,6 +13,8 @@ Number.isNaN = Number.isNaN || function(value) { ReactDOM.createRoot(document.getElementById('root')).render( - + + + ) diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json b/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json deleted file mode 100644 index 41b42e677..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.json +++ /dev/null @@ -1,3 +0,0 @@ -[ - -] diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx new file mode 100644 index 000000000..6abcae505 --- /dev/null +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx @@ -0,0 +1,3 @@ +export const routes = [ + +]; diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx index ca2f11432..394823667 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx @@ -1,31 +1,21 @@ -import { Route, BrowserRouter as Router, Switch } from "react-router-dom"; -import asyncComponent from "./hoc/asyncComponent"; +import { Route, Routes } from "react-router-dom"; import NavigationHeader from "./components/navigation-header/index"; -import routes from "./routes.json"; +import { routes } from './routes'; import "./App.css"; export default function App() { - const name = "$(name)"; + const name = "$(name)"; return ( -
-
{name}
- -
- - {routes.map((route, i) => ( - - import("" + route.componentPath) - )} - /> - ))} - +
{name}
+ +
+ + {routes.map((route, i) => ( + + ))} + +
-
- - ); -} \ No newline at end of file + ); +} diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx index d00860385..fc35bf948 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from 'react'; -import { NavLink } from 'react-router-dom'; +import { Link } from 'react-router-dom'; export default function NavigationHeader({ routes }) { const [state, setState] = useState({ activeItem: null }); @@ -21,7 +21,7 @@ export default function NavigationHeader({ routes }) { diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx deleted file mode 100644 index 17f1f81e2..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/hoc/asyncComponent.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import { Component } from 'react'; - -// https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html -const makeCancelable = (promise) => { - let hasCanceled_ = false; - - const wrappedPromise = new Promise((resolve, reject) => { - promise.then( - val => hasCanceled_ ? reject({isCanceled: true}) : resolve(val), - error => hasCanceled_ ? reject({isCanceled: true}) : reject(error) - ); - }); - - return { - promise: wrappedPromise, - cancel() { - hasCanceled_ = true; - }, - }; - }; - -/** - * https://medium.com/front-end-weekly/loading-components-asynchronously-in-react-app-with-an-hoc-61ca27c4fda7 - * @param {function} importComponent - */ -const asyncComponent = (importComponent) => { - return class extends Component { - state = { - component: null - } - - componentDidMount() { - this.op = makeCancelable(importComponent()); - this.op.promise.then(cmp => { - this.setState({component: cmp.default}); - }); - } - - componentWillUnmount() { - this.op.cancel(); - } - - render() { - const C = this.state.component; - return C ? : null; - } - } -}; - -export default asyncComponent; diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json deleted file mode 100644 index 62ca363d6..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.json +++ /dev/null @@ -1,7 +0,0 @@ -[ - { - "path": "/", - "componentPath": "./views/home", - "text": "Home" - } -] diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx new file mode 100644 index 000000000..2ccc7fd73 --- /dev/null +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx @@ -0,0 +1,5 @@ +import Home from './views/home'; + +export const routes = [ + { path: '/', element: , text: 'Home' } +]; From 8ced6b041360ff8e8b9ffd97177cd84d630192bd Mon Sep 17 00:00:00 2001 From: "INFRAGISTICS\\IBarakov" Date: Wed, 11 Oct 2023 16:06:05 +0300 Subject: [PATCH 45/66] chore: release 12.1.0-beta.1 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 7a58c0f16..4a9925d7e 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.1.0-beta.0", + "version": "12.1.0-beta.1", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1210-beta.0", - "@igniteui/cli-core": "~12.1.0-beta.0", + "@igniteui/angular-templates": "~16.0.1210-beta.1", + "@igniteui/cli-core": "~12.1.0-beta.1", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 68fbe79e6..0dca786f9 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.1.0-beta.0", + "version": "12.1.0-beta.1", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index 247abc3a2..5c2e2ff2b 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1210-beta.0", + "version": "16.0.1210-beta.1", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.1.0-beta.0", + "@igniteui/cli-core": "~12.1.0-beta.1", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 3b7e4ac76..9a97dcba0 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1210-beta.0", + "version": "16.0.1210-beta.1", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1210-beta.0", - "@igniteui/cli-core": "~12.1.0-beta.0", + "@igniteui/angular-templates": "~16.0.1210-beta.1", + "@igniteui/cli-core": "~12.1.0-beta.1", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 5503b26d0c777b2e69df1f4bc11d748b50226fee Mon Sep 17 00:00:00 2001 From: "INFRAGISTICS\\IBarakov" Date: Wed, 11 Oct 2023 16:09:32 +0300 Subject: [PATCH 46/66] chore: fix lint --- packages/cli/lib/templates/IgniteUIForReactTemplate.ts | 5 ++--- packages/cli/templates/react/ReactTypeScriptFileUpdate.ts | 7 +++---- 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 8da092090..05835eb94 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -1,7 +1,6 @@ import { AddTemplateArgs, ControlExtraConfiguration, defaultDelimiters, Template, Util } from "@igniteui/cli-core"; -import * as fs from "fs-extra"; -import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; import * as path from "path"; +import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; export class IgniteUIForReactTemplate implements Template { public components: string[]; @@ -58,7 +57,7 @@ export class IgniteUIForReactTemplate implements Template { return; } - const routeModulePath: string = 'src/routes.tsx'; + const routeModulePath: string = "src/routes.tsx"; const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); routingModule.addRoute( diff --git a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts index 8d38ed4a6..ea195fd30 100644 --- a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts +++ b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts @@ -141,13 +141,13 @@ export class ReactTypeScriptFileUpdate { }; let visitCondition; - + if (!isRouting) { visitCondition = (node: ts.Node): boolean => { return node.kind === ts.SyntaxKind.VariableDeclaration && (node as ts.VariableDeclaration).name.getText() === routesVariable; // no type currently - //(node as ts.VariableDeclaration).type.getText() === "Route[]"; + //(node as ts.VariableDeclaration).type.getText() === "Route[]"; }; } else { visitCondition = (node: ts.Node): boolean => { @@ -417,8 +417,7 @@ export class ReactTypeScriptFileUpdate { const routePath = ts.factory.createPropertyAssignment("path", ts.factory.createStringLiteral(className, true)); const jsxElement = ts.factory.createJsxSelfClosingElement( ts.factory.createIdentifier(linkText), [], undefined - ); - + ); const routeComponent = ts.factory.createPropertyAssignment("element", jsxElement); const routeData = ts.factory.createPropertyAssignment("text", ts.factory.createStringLiteral(linkText, true)); From 67f3fbea08eeaf9041d903498e8e6c9e2c8263e5 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Tue, 24 Oct 2023 15:16:23 +0300 Subject: [PATCH 47/66] chore: rename template files --- .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../basic/files/src/{views => app}/__path__/data.tsx | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 .../react/igr-ts/projects/_base/files/src/App.tsx | 10 ---------- .../projects/_base/files/src/{ => app}/App.test.tsx | 0 .../react/igr-ts/projects/_base/files/src/app/App.tsx | 6 ++++++ .../_base/files/src/{routes.tsx => app/app-routes.tsx} | 0 .../_base_with_home/files/src/{ => app}/App.module.css | 0 .../_base_with_home/files/src/{ => app}/App.test.tsx | 0 .../_base_with_home/files/src/{ => app}/App.tsx | 0 .../projects/top-nav/files/src/{ => app}/App.css | 0 .../projects/top-nav/files/src/{ => app}/App.tsx | 4 ++-- .../files/src/{routes.tsx => app/app-routes.tsx} | 2 +- .../src/{views/home/index.tsx => app/home/home.tsx} | 0 .../top-nav/files/src/{views => app}/home/logo.svg | 0 .../files/src/{views => app}/home/style.module.css | 0 .../__path__/__filePrefix__.test.tsx} | 0 .../index.tsx => app/__path__/__filePrefix__.tsx} | 0 .../files/src/{views => app}/__path__/style.module.css | 0 38 files changed, 9 insertions(+), 13 deletions(-) rename packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/category-chart/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/category-chart/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/category-chart/default/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/financial-chart/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/financial-chart/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/financial-chart/default/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/grid/basic/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/grid/basic/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/grid/basic/files/src/{views => app}/__path__/data.tsx (100%) rename packages/cli/templates/react/igr-ts/grid/basic/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/{views => app}/__path__/style.module.css (100%) rename packages/cli/templates/react/igr-ts/pie-chart/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/pie-chart/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/pie-chart/default/files/src/{views => app}/__path__/style.module.css (100%) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx rename packages/cli/templates/react/igr-ts/projects/_base/files/src/{ => app}/App.test.tsx (100%) create mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx rename packages/cli/templates/react/igr-ts/projects/_base/files/src/{routes.tsx => app/app-routes.tsx} (100%) rename packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/{ => app}/App.module.css (100%) rename packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/{ => app}/App.test.tsx (100%) rename packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/{ => app}/App.tsx (100%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{ => app}/App.css (100%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{ => app}/App.tsx (83%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{routes.tsx => app/app-routes.tsx} (70%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{views/home/index.tsx => app/home/home.tsx} (100%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{views => app}/home/logo.svg (100%) rename packages/cli/templates/react/igr-ts/projects/top-nav/files/src/{views => app}/home/style.module.css (100%) rename packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/{views/__path__/index.test.tsx => app/__path__/__filePrefix__.test.tsx} (100%) rename packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/{views/__path__/index.tsx => app/__path__/__filePrefix__.tsx} (100%) rename packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/{views => app}/__path__/style.module.css (100%) diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/category-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/financial-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/data.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/data.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/data.tsx rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/data.tsx diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/grid/basic/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/pie-chart/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx deleted file mode 100644 index 2421b1534..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { BrowserRouter } from "react-router-dom"; - -export default function App() { - - return ( -
- -
- ) -} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base/files/src/App.test.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.test.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx new file mode 100644 index 000000000..40fcacf8b --- /dev/null +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx @@ -0,0 +1,6 @@ +export default function App() { + + return ( +
+ ) +} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/app-routes.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base/files/src/routes.tsx rename to packages/cli/templates/react/igr-ts/projects/_base/files/src/app/app-routes.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.module.css b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.module.css rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.module.css diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.test.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.test.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/App.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.css rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx similarity index 83% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx index 394823667..8b5344f83 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx @@ -1,6 +1,6 @@ import { Route, Routes } from "react-router-dom"; -import NavigationHeader from "./components/navigation-header/index"; -import { routes } from './routes'; +import NavigationHeader from "../components/navigation-header"; +import { routes } from './app-routes'; import "./App.css"; export default function App() { diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/app-routes.tsx similarity index 70% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/app-routes.tsx index 2ccc7fd73..e34cacdf1 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/routes.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/app-routes.tsx @@ -1,4 +1,4 @@ -import Home from './views/home'; +import Home from './home/home'; export const routes = [ { path: '/', element: , text: 'Home' } diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/index.tsx rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/logo.svg b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/logo.svg rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/style.module.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/views/home/style.module.css rename to packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.test.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.test.tsx rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/index.tsx rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.tsx diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/style.module.css b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/views/__path__/style.module.css rename to packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css From 7cd289512eb01ec1612a46a0bf24a27e13342fb9 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Tue, 24 Oct 2023 15:17:48 +0300 Subject: [PATCH 48/66] chore: fix component registration --- packages/cli/lib/commands/add.ts | 19 ++++-- .../lib/templates/IgniteUIForReactTemplate.ts | 68 ++++++++++++------- .../react/ReactTypeScriptFileUpdate.ts | 27 ++++---- .../igr-ts/projects/_base/files/src/main.tsx | 3 +- 4 files changed, 72 insertions(+), 45 deletions(-) diff --git a/packages/cli/lib/commands/add.ts b/packages/cli/lib/commands/add.ts index dfa6e1b9b..4ec5f3319 100644 --- a/packages/cli/lib/commands/add.ts +++ b/packages/cli/lib/commands/add.ts @@ -115,11 +115,20 @@ command = { }, async addTemplate(fileName: string, template: Template, options?: AddTemplateArgs): Promise { if (!options) { - options = { - parentName: "app", - parentRoutingModulePath: "src/app/app-routing.ts", - selector: "app-" + template.id - }; + if (template.framework === 'react') { + options = { + parentName: "app", + parentRoutingModulePath: "src/app/app-routes.tsx", + className: Util.className(fileName), + modulePath: `src/app/${Util.lowerDashed(fileName)}` + } + } else { + options = { + parentName: "app", + parentRoutingModulePath: "src/app/app-routing.ts", + selector: "app-" + template.id + }; + } } fileName = fileName.trim(); diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 05835eb94..43170c54c 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -1,4 +1,4 @@ -import { AddTemplateArgs, ControlExtraConfiguration, defaultDelimiters, Template, Util } from "@igniteui/cli-core"; +import { AddTemplateArgs, App, ControlExtraConfiguration, defaultDelimiters, FS_TOKEN, IFileSystem, Template, Util } from "@igniteui/cli-core"; import * as path from "path"; import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; @@ -19,8 +19,6 @@ export class IgniteUIForReactTemplate implements Template { // non-standard template prop protected widget: string; - private configFile: string = "./src/routes.tsx"; - /** * Base ReactTemplate constructor * @param rootPath The template folder path. Pass in `__dirname` @@ -40,6 +38,7 @@ export class IgniteUIForReactTemplate implements Template { config["path"] = this.folderName(name); //folder name allowed spaces, any casing config["name"] = Util.nameFromPath(name); // this name should not have restrictions config["ClassName"] = Util.className(Util.nameFromPath(name)); //first letter capital, no spaces and no dashes, + config["filePrefix"] = Util.lowerDashed(Util.nameFromPath(name)); config["cliVersion"] = Util.version(); if (this.widget) { config["widget"] = this.widget; @@ -52,21 +51,50 @@ export class IgniteUIForReactTemplate implements Template { return config; } - public registerInProject(projectPath: string, name: string, options?: AddTemplateArgs) { - if (options && options.skipRoute) { - return; - } + public registerInProject(projectPath: string, name: string, options?: AddTemplateArgs, defaultPath = false) { + if (!options.parentName) { + return; + } - const routeModulePath: string = "src/routes.tsx"; + const routeModulePath: string = options.parentRoutingModulePath; const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); - routingModule.addRoute( - path.join(projectPath, `src/views/${this.folderName(name)}`), - Util.lowerDashed(Util.nameFromPath(name)), - Util.className(Util.nameFromPath(name)), - options.routerChildren, - undefined - ); + if (!(options && options.skipRoute) && App.container.get(FS_TOKEN) + .fileExists(routeModulePath)) { + let nameFromPath = Util.nameFromPath(name); + let lowerDashed = Util.lowerDashed(nameFromPath); + let filePath = path.posix.join(projectPath, options.modulePath, `${lowerDashed}.tsx`); + + if (defaultPath) { + routingModule.addRoute("", options.className, nameFromPath, filePath, options.routerChildren, undefined); + } + + routingModule.addRoute( + lowerDashed, + options.className, + nameFromPath, + filePath, + options.routerChildren, + undefined + ); + + if (options.hasChildren) { + nameFromPath = Util.nameFromPath(`${options.modulePath}-routes.tsx`); + lowerDashed = Util.lowerDashed(nameFromPath); + filePath = path.posix.join(projectPath, options.modulePath, nameFromPath); + + routingModule.addRoute( + lowerDashed, + options.className, + nameFromPath, + filePath, + options.routerChildren, + options.importAlias + ); + } + } + + } public getExtraConfiguration(): ControlExtraConfiguration[] { throw new Error("Method not implemented."); @@ -95,14 +123,4 @@ export class IgniteUIForReactTemplate implements Template { } return Util.lowerDashed(folderName); } - protected getViewLink(name: string): string { - const filePath = "./views/" + this.folderName(name); - return filePath; - } - - protected getToolbarLink(name: string): string { - name = Util.nameFromPath(name); - const toolbarLink = name.replace(/\w\S*/g, txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()); - return toolbarLink; - } } diff --git a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts index ea195fd30..909213a37 100644 --- a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts +++ b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts @@ -37,11 +37,12 @@ export class ReactTypeScriptFileUpdate { path: string, component: string, name: string, + filePath: string, routerChildren: string, importAlias: string, routesVariable = DEFAULT_ROUTES_VARIABLE ) { - this.addRouteModuleEntry(path, component, name, routerChildren, importAlias, routesVariable); + this.addRouteModuleEntry(path, component, name, filePath, routerChildren, importAlias, routesVariable); } //#region File state @@ -89,22 +90,21 @@ export class ReactTypeScriptFileUpdate { path: string, component: string, name: string, + filePath: string, routerChildren: string, importAlias: string, routesVariable = DEFAULT_ROUTES_VARIABLE ) { - const isRouting: boolean = path.indexOf("routing") >= 0; + const isRouting: boolean = path.indexOf("routes") >= 0; - if (isRouting && this.targetSource.text.indexOf(path.slice(0, -3)) > 0) { + if (isRouting && this.targetSource.text.indexOf(path.slice(0, -4)) > 0) { return; } - const moduleName = path.substring(0, path.indexOf("-routing")); if (path) { - const relativePath: string = isRouting ? - "./views/" + moduleName + "/" + path.slice(0, -3) : Util.relativePath(this.targetPath, path, true, true); + const relativePath: string = Util.relativePath(this.targetPath, filePath, true, true); - this.requestImport(relativePath, importAlias, name); + this.requestImport(relativePath, importAlias, component); } // https://github.com/Microsoft/TypeScript/issues/14419#issuecomment-307256171 @@ -113,7 +113,7 @@ export class ReactTypeScriptFileUpdate { // the visitor that should be used when adding routes to the main route array const conditionalVisitor: ts.Visitor = (node: ts.Node): ts.Node => { if (node.kind === ts.SyntaxKind.ArrayLiteralExpression) { - const newObject = this.createRouteEntry(component, name, routerChildren); + const newObject = this.createRouteEntry(path, component, name, routerChildren); const array = (node as ts.ArrayLiteralExpression); this.createdStringLiterals.push(path, name); const notFoundWildCard = ".*"; @@ -410,17 +410,18 @@ export class ReactTypeScriptFileUpdate { } private createRouteEntry( - className: string, - linkText: string, + path: string, + component: string, + name: string, routerAlias: string ): ts.ObjectLiteralExpression { - const routePath = ts.factory.createPropertyAssignment("path", ts.factory.createStringLiteral(className, true)); + const routePath = ts.factory.createPropertyAssignment("path", ts.factory.createStringLiteral(path, true)); const jsxElement = ts.factory.createJsxSelfClosingElement( - ts.factory.createIdentifier(linkText), [], undefined + ts.factory.createIdentifier(component), [], undefined ); const routeComponent = ts.factory.createPropertyAssignment("element", jsxElement); - const routeData = ts.factory.createPropertyAssignment("text", ts.factory.createStringLiteral(linkText, true)); + const routeData = ts.factory.createPropertyAssignment("text", ts.factory.createStringLiteral(name, true)); if (routerAlias) { const childrenData = ts.factory.createPropertyAssignment("children", ts.factory.createIdentifier(routerAlias)); return ts.factory.createObjectLiteralExpression([routePath, routeComponent, routeData, childrenData]); diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx index 0c57d2874..8bb76af22 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx @@ -2,12 +2,11 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import { BrowserRouter as Router } from 'react-router-dom'; import './index.css'; -import App from './App'; +import App from './app/App'; import 'react-app-polyfill/ie11'; /** Required in IE11 for Charts */ Number.isNaN = Number.isNaN || function(value) { - // eslint-disable-next-line return value !== value; } From 8cdf3b5e91fce04109883c2809e4eea2d7050827 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Tue, 24 Oct 2023 15:24:21 +0300 Subject: [PATCH 49/66] fix: igr-ts specificPath --- packages/core/util/Util.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/core/util/Util.ts b/packages/core/util/Util.ts index 1db3c15fc..68d082167 100644 --- a/packages/core/util/Util.ts +++ b/packages/core/util/Util.ts @@ -399,8 +399,10 @@ export class Util { specificPath = path.join("src", "app", "components"); } else if (framework === "react" && projectType === "es6") { specificPath = path.join("src", "components"); - } else if (framework === "react" && (projectType === "igr-es6" || projectType === "igr-ts")) { + } else if (framework === "react" && projectType === "igr-es6") { specificPath = path.join("src", "views"); + } else if (framework === "react" && projectType === "igr-ts") { + specificPath = path.join("src", "app"); } else if (framework === "webcomponents" && projectType === "igc-ts") { specificPath = path.join("src", "app"); } From 6ed5f3469d71f40089626dcdd383dc07599b0645 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Wed, 25 Oct 2023 12:21:25 +0300 Subject: [PATCH 50/66] fix: react igr ts templates --- .../projects/_base/files/src/app/App.tsx | 21 +++++++++++++-- .../files/src/app/App.test.tsx | 8 ------ .../files/src/app/app-routes.tsx | 0 .../files/src/app/{App.tsx => home/home.tsx} | 2 +- .../{App.module.css => home/style.module.css} | 0 .../_base_with_home/files/src/setupTests.ts | 5 ---- .../react/igr-ts/projects/base/index.ts | 2 +- .../react/igr-ts/projects/empty/index.ts | 2 +- .../projects/top-nav/files/src/app/App.tsx | 13 ++++++--- .../top-nav/files/src/app/home/home.tsx | 17 ------------ .../top-nav/files/src/app/home/logo.svg | 7 ----- .../files/src/app/home/style.module.css | 27 ------------------- .../projects/top-nav/files/src/setupTests.ts | 5 ---- .../react/igr-ts/projects/top-nav/index.ts | 4 +-- 14 files changed, 34 insertions(+), 79 deletions(-) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx rename packages/cli/templates/react/igr-ts/projects/{top-nav => _base_with_home}/files/src/app/app-routes.tsx (100%) rename packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/{App.tsx => home/home.tsx} (93%) rename packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/{App.module.css => home/style.module.css} (100%) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css delete mode 100644 packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx index 40fcacf8b..4fee29c54 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx @@ -1,6 +1,23 @@ +import { Route, Routes } from "react-router-dom"; +import { routes } from "./app-routes"; + export default function App() { + function createRoutes(config) { + return config.map((route, index) => ( + + {route.children && createRoutes(route.children)} + + )); + } + return ( -
+
+
+ + {createRoutes(routes)} + +
+
) -} +} \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx deleted file mode 100644 index e15e55062..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.test.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import { expect, test } from 'vitest'; -import { render } from '@testing-library/react'; -import App from './App'; - -test('renders without crashing', () => { - const wrapper = render(); - expect(wrapper).toBeTruthy(); -}); diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/app-routes.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/app-routes.tsx similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/app-routes.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/app-routes.tsx diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx similarity index 93% rename from packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.tsx rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx index 60a05e762..c9b6620f5 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx @@ -1,5 +1,5 @@ import logo from '/logo.svg'; -import styles from './App.module.css'; +import styles from './style.module.css'; export default function App() { const name = "$(name)"; diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.module.css b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/style.module.css similarity index 100% rename from packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/App.module.css rename to packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/style.module.css diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts deleted file mode 100644 index 698aeae9f..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/setupTests.ts +++ /dev/null @@ -1,5 +0,0 @@ -import '@testing-library/jest-dom' -import 'vitest-canvas-mock' -import ResizeObserver from 'resize-observer-polyfill' - -global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts/projects/base/index.ts b/packages/cli/templates/react/igr-ts/projects/base/index.ts index a543908b1..269deb770 100644 --- a/packages/cli/templates/react/igr-ts/projects/base/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/base/index.ts @@ -5,7 +5,7 @@ import { BaseIgrTsProject } from "../_base"; export class BasePageIgrTsProject extends BaseIgrTsProject implements ProjectTemplate { public id: string = "base"; public name = "Base project"; - public description = "Empty project structure"; + public description = "Empty project structure with routing"; public dependencies: string[] = []; public framework: string = "react"; public projectType: string = "igr-ts"; diff --git a/packages/cli/templates/react/igr-ts/projects/empty/index.ts b/packages/cli/templates/react/igr-ts/projects/empty/index.ts index 1cc882162..86b8428ae 100644 --- a/packages/cli/templates/react/igr-ts/projects/empty/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/empty/index.ts @@ -5,7 +5,7 @@ import { BaseWithHomeIgrTsProject } from "../_base_with_home"; export class EmptyIgrTsProject extends BaseWithHomeIgrTsProject implements ProjectTemplate { public id: string = "empty"; public name = "Empty project"; - public description = "Empty project structure with home page"; + public description = "Empty project structure with home page and routing"; public dependencies: string[] = []; public framework: string = "react"; public projectType: string = "igr-ts"; diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx index 8b5344f83..35d7a3398 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx @@ -5,15 +5,22 @@ import "./App.css"; export default function App() { const name = "$(name)"; + + function createRoutes(config) { + return config.map((route, i) => ( + + {route.children && createRoutes(route.children)} + + )); + } + return (
{name}
- {routes.map((route, i) => ( - - ))} + {createRoutes(routes)}
diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx deleted file mode 100644 index 91037fa0c..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/home.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import logo from './logo.svg'; -import styles from './style.module.css'; - -export default function Home() { - return ( -
- logo -

Welcome to Ignite UI for React!

- - Learn More - -
- ) -} diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg deleted file mode 100644 index 6b60c1042..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/logo.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css deleted file mode 100644 index 37275755a..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/home/style.module.css +++ /dev/null @@ -1,27 +0,0 @@ -:local(.logo) { - animation: App-logo-spin infinite 20s linear; - height: 40vmin; -} - -:local(.header) { - padding-top: 5em; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: #333; -} - -:local(.link) { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts deleted file mode 100644 index 698aeae9f..000000000 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/setupTests.ts +++ /dev/null @@ -1,5 +0,0 @@ -import '@testing-library/jest-dom' -import 'vitest-canvas-mock' -import ResizeObserver from 'resize-observer-polyfill' - -global.ResizeObserver = ResizeObserver \ No newline at end of file diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts b/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts index a9a7617c7..48d4cab80 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/index.ts @@ -1,8 +1,8 @@ import { ProjectTemplate } from "@igniteui/cli-core"; import * as path from "path"; -import { BaseIgrTsProject } from "../_base"; +import { BaseWithHomeIgrTsProject } from "../_base_with_home"; -export class TopNavIgrTsProject extends BaseIgrTsProject implements ProjectTemplate { +export class TopNavIgrTsProject extends BaseWithHomeIgrTsProject implements ProjectTemplate { public id: string = "top-nav"; public name = "Default top navigation"; public description = "Project structure with top navigation menu"; From 1193ec1ef8095b7fb8e29c7ee328d8547132bbfb Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Wed, 25 Oct 2023 12:30:07 +0300 Subject: [PATCH 51/66] chore: fix lint --- packages/cli/lib/commands/add.ts | 4 ++-- .../lib/templates/IgniteUIForReactTemplate.ts | 19 +++++++++++++------ 2 files changed, 15 insertions(+), 8 deletions(-) diff --git a/packages/cli/lib/commands/add.ts b/packages/cli/lib/commands/add.ts index 4ec5f3319..990b38584 100644 --- a/packages/cli/lib/commands/add.ts +++ b/packages/cli/lib/commands/add.ts @@ -115,13 +115,13 @@ command = { }, async addTemplate(fileName: string, template: Template, options?: AddTemplateArgs): Promise { if (!options) { - if (template.framework === 'react') { + if (template.framework === "react") { options = { parentName: "app", parentRoutingModulePath: "src/app/app-routes.tsx", className: Util.className(fileName), modulePath: `src/app/${Util.lowerDashed(fileName)}` - } + }; } else { options = { parentName: "app", diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 43170c54c..3c5843e2b 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -1,4 +1,13 @@ -import { AddTemplateArgs, App, ControlExtraConfiguration, defaultDelimiters, FS_TOKEN, IFileSystem, Template, Util } from "@igniteui/cli-core"; +import { + AddTemplateArgs, + App, + ControlExtraConfiguration, + defaultDelimiters, + FS_TOKEN, + IFileSystem, + Template, + Util +} from "@igniteui/cli-core"; import * as path from "path"; import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; @@ -53,8 +62,8 @@ export class IgniteUIForReactTemplate implements Template { public registerInProject(projectPath: string, name: string, options?: AddTemplateArgs, defaultPath = false) { if (!options.parentName) { - return; - } + return; + } const routeModulePath: string = options.parentRoutingModulePath; const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); @@ -88,13 +97,11 @@ export class IgniteUIForReactTemplate implements Template { options.className, nameFromPath, filePath, - options.routerChildren, + options.routerChildren, options.importAlias ); } } - - } public getExtraConfiguration(): ControlExtraConfiguration[] { throw new Error("Method not implemented."); From 9ace912aa2830efef716268f1b3a28550a9cbbd5 Mon Sep 17 00:00:00 2001 From: lipata Date: Fri, 27 Oct 2023 11:19:12 +0300 Subject: [PATCH 52/66] chore: release 12.1.0-beta.2 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 4a9925d7e..100c923cc 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.1.0-beta.1", + "version": "12.1.0-beta.2", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1210-beta.1", - "@igniteui/cli-core": "~12.1.0-beta.1", + "@igniteui/angular-templates": "~16.0.1210-beta.2", + "@igniteui/cli-core": "~12.1.0-beta.2", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 0dca786f9..9dd0a71f0 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.1.0-beta.1", + "version": "12.1.0-beta.2", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index 5c2e2ff2b..c60be1d25 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1210-beta.1", + "version": "16.0.1210-beta.2", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.1.0-beta.1", + "@igniteui/cli-core": "~12.1.0-beta.2", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 9a97dcba0..9232e181a 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1210-beta.1", + "version": "16.0.1210-beta.2", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1210-beta.1", - "@igniteui/cli-core": "~12.1.0-beta.1", + "@igniteui/angular-templates": "~16.0.1210-beta.2", + "@igniteui/cli-core": "~12.1.0-beta.2", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 09148d9598be3c0046b30b0d31a74f919cebc864 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Tue, 31 Oct 2023 11:13:48 +0200 Subject: [PATCH 53/66] chore: remove obsolete files and packages --- .../projects/_base/files/__dot__editorconfig | 3 --- .../react/igr-ts/projects/_base/files/index.html | 5 ----- .../igr-ts/projects/_base/files/package.json | 1 - .../projects/_base/files/public/manifest.json | 15 --------------- .../igr-ts/projects/_base/files/src/vite-env.d.ts | 1 - .../igr-ts/projects/_base/files/tsconfig.json | 5 +++-- .../projects/_base/files/tsconfig.node.json | 10 ---------- 7 files changed, 3 insertions(+), 37 deletions(-) delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts delete mode 100644 packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig b/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig deleted file mode 100644 index 0f3bb618c..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/__dot__editorconfig +++ /dev/null @@ -1,3 +0,0 @@ -[*.js] -indent_style = space -indent_size = 2 diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/index.html b/packages/cli/templates/react/igr-ts/projects/_base/files/index.html index 0c9022edb..63238fb05 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/index.html +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/index.html @@ -8,11 +8,6 @@ content="width=device-width, initial-scale=1, shrink-to-fit=no" /> - - IgniteUI for React diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json index 8113c69b2..00c372111 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json @@ -13,7 +13,6 @@ "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.16.0", - "react-native-get-random-values": "^1.9.0", "resize-observer-polyfill": "^1.5.1", "vitest": "^0.34.4", "igniteui-dockmanager": "^1.13.0" diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json b/packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json deleted file mode 100644 index 27c95fff2..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/public/manifest.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "short_name": "$(name)", - "name": "$(name)", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts deleted file mode 100644 index 11f02fe2a..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/vite-env.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json b/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json index 026bb22be..a39d6f990 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.json @@ -5,6 +5,8 @@ "lib": ["ES2020", "DOM", "DOM.Iterable"], "module": "ESNext", "skipLibCheck": true, + "composite": true, + "allowSyntheticDefaultImports": true, /* Bundler mode */ "moduleResolution": "bundler", @@ -20,6 +22,5 @@ "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, - "include": ["src", "vite.config.ts"], - "references": [{ "path": "./tsconfig.node.json" }] + "include": ["src", "vite.config.ts"] } diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json b/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json deleted file mode 100644 index 42872c59f..000000000 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/tsconfig.node.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "compilerOptions": { - "composite": true, - "skipLibCheck": true, - "module": "ESNext", - "moduleResolution": "bundler", - "allowSyntheticDefaultImports": true - }, - "include": ["vite.config.ts"] -} From 0d13896745a376358efd9cc064c9fd46c73488cf Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Mon, 6 Nov 2023 12:05:21 +0200 Subject: [PATCH 54/66] chore: update igniteui-react version+remove unused func --- .../cli/templates/react/ReactTypeScriptFileUpdate.ts | 10 ---------- .../react/igr-ts/bullet-graph/default/index.ts | 2 +- .../react/igr-ts/category-chart/default/index.ts | 2 +- .../react/igr-ts/doughnut-chart/default/index.ts | 2 +- .../react/igr-ts/financial-chart/default/index.ts | 2 +- .../cli/templates/react/igr-ts/grid/basic/index.ts | 4 ++-- .../react/igr-ts/linear-gauge/default/index.ts | 2 +- .../templates/react/igr-ts/pie-chart/default/index.ts | 2 +- .../react/igr-ts/projects/_base/files/package.json | 4 ++-- .../react/igr-ts/radial-gauge/default/index.ts | 2 +- 10 files changed, 11 insertions(+), 21 deletions(-) diff --git a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts index 909213a37..a392c85db 100644 --- a/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts +++ b/packages/cli/templates/react/ReactTypeScriptFileUpdate.ts @@ -384,16 +384,6 @@ export class ReactTypeScriptFileUpdate { //#endregion Formatting - /** Convert a string or string array union to array. Splits strings as comma delimited */ - private asArray(value: string | string[], variables: { [key: string]: string }): string[] { - let result: string[] = []; - if (value) { - result = typeof value === "string" ? value.split(/\s*,\s*/) : value; - result = result.map(x => Util.applyConfigTransformation(x, variables)); - } - return result; - } - private createVisitor( conditionalVisitor: ts.Visitor, visitCondition: (node: ts.Node) => boolean, diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts index 0348af73f..04f521723 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/index.ts @@ -11,7 +11,7 @@ class IgrTsBulletGraphTemplate extends IgniteUIForReactTemplate { this.name = "Bullet Graph"; this.description = `allows for a linear and concise view of measures compared against a scale.`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; + this.packages = ["igniteui-react-gauges@18.3.0"]; } } module.exports = new IgrTsBulletGraphTemplate(); diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts index 87706ad6f..4b72b1f60 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/category-chart/default/index.ts @@ -12,7 +12,7 @@ class IgrTsCategoryChartTemplate extends IgniteUIForReactTemplate { this.description = `makes visualizing category data easy. Simplifies the complexities of the data visualization domain into manageable API`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; + this.packages = ["igniteui-react-charts@18.3.0"]; } } module.exports = new IgrTsCategoryChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts index 33e5665df..df639b961 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/index.ts @@ -11,7 +11,7 @@ class IgrTsDoughnutChartTemplate extends IgniteUIForReactTemplate { this.name = "Doughnut Chart"; this.description = `proportionally illustrate the occurrences of variables.`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; + this.packages = ["igniteui-react-charts@18.3.0"]; } } module.exports = new IgrTsDoughnutChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts index 3ab2f4f51..cb5643c29 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/index.ts @@ -13,7 +13,7 @@ class IgrTsFinancialChartTemplate extends IgniteUIForReactTemplate { this.description = `charting component that makes it easy to visualize financial data by using a simple and intuitive API.`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; + this.packages = ["igniteui-react-charts@18.3.0"]; } } module.exports = new IgrTsFinancialChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/grid/basic/index.ts b/packages/cli/templates/react/igr-ts/grid/basic/index.ts index c2ab5583d..d070bc4df 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/index.ts +++ b/packages/cli/templates/react/igr-ts/grid/basic/index.ts @@ -15,8 +15,8 @@ class GridTemplate extends IgniteUIForReactTemplate { this.components = ["Grid"]; this.controlGroup = "Data Grids"; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-grids@18.2.2-beta.0", "igniteui-react-inputs@18.2.2-beta.0", - "igniteui-react-layouts@18.2.2-beta.0"]; + this.packages = ["igniteui-react-grids@18.3.0", "igniteui-react-inputs@18.3.0", + "igniteui-react-layouts@18.3.0"]; this.hasExtraConfiguration = false; } diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts index b5be018c9..3e9a11621 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/index.ts @@ -11,7 +11,7 @@ class IgrTsLinearGaugeTemplate extends IgniteUIForReactTemplate { this.name = "Linear Gauge"; this.description = `value compared against a scale and one or more ranges.`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; + this.packages = ["igniteui-react-gauges@18.3.0"]; } } module.exports = new IgrTsLinearGaugeTemplate(); diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts index 144f2215b..d0a953497 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/index.ts @@ -11,7 +11,7 @@ class IgrTsPieChartTemplate extends IgniteUIForReactTemplate { this.name = "Pie Chart"; this.description = `easily illustate the proportions of data entries`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-charts@18.2.2-beta.0"]; + this.packages = ["igniteui-react-charts@18.3.0"]; } } module.exports = new IgrTsPieChartTemplate(); diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json index 00c372111..89383b873 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/package.json +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/package.json @@ -7,8 +7,8 @@ "@testing-library/jest-dom": "^6.1.3", "@testing-library/react": "^14.0.0", "functions-have-names": "^1.2.3", - "igniteui-react": "18.2.2-beta.0", - "igniteui-react-core": "18.2.2-beta.0", + "igniteui-react": "18.3.0", + "igniteui-react-core": "18.3.0", "react": "^18.2.0", "react-app-polyfill": "^0.2.0", "react-dom": "^18.2.0", diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts index a968cd874..fe123847a 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/index.ts @@ -12,7 +12,7 @@ class IgrTsRadialGaugeTemplate extends IgniteUIForReactTemplate { this.description = `provides a number of visual elements, like a needle, tick marks, ranges and labels, in order to create a predefined shape and scale.`; // TODO: read version from igniteui-react-core in package.json - this.packages = ["igniteui-react-gauges@18.2.2-beta.0"]; + this.packages = ["igniteui-react-gauges@18.3.0"]; } } module.exports = new IgrTsRadialGaugeTemplate(); From 425a6d7918ffbca8c4d007fa484d0ceb9cdbb8db Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Wed, 8 Nov 2023 15:45:17 +0200 Subject: [PATCH 55/66] chore: edit launch config --- .vscode/launch.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.vscode/launch.json b/.vscode/launch.json index 1df2d9a80..3d10cba23 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -100,7 +100,7 @@ "new", "reactproj", "--framework=react", - "--type=igr-ts-es6" + "--type=igr-ts" ] }, { From ebb998e93193acad4f5405e8b5dc4506538cedbe Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Wed, 8 Nov 2023 15:49:58 +0200 Subject: [PATCH 56/66] chore: release 12.1.0-beta.3 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 100c923cc..bf6e98196 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.1.0-beta.2", + "version": "12.1.0-beta.3", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1210-beta.2", - "@igniteui/cli-core": "~12.1.0-beta.2", + "@igniteui/angular-templates": "~16.0.1210-beta.3", + "@igniteui/cli-core": "~12.1.0-beta.3", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 9dd0a71f0..3ab2c4412 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.1.0-beta.2", + "version": "12.1.0-beta.3", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index c60be1d25..d5259aeca 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1210-beta.2", + "version": "16.0.1210-beta.3", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.1.0-beta.2", + "@igniteui/cli-core": "~12.1.0-beta.3", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 9232e181a..45edfc3bf 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1210-beta.2", + "version": "16.0.1210-beta.3", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1210-beta.2", - "@igniteui/cli-core": "~12.1.0-beta.2", + "@igniteui/angular-templates": "~16.0.1210-beta.3", + "@igniteui/cli-core": "~12.1.0-beta.3", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 126c7270f2f30ca35d385223b4fa19021677ba35 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Wed, 29 Nov 2023 10:38:58 +0200 Subject: [PATCH 57/66] fix: use createBrowserRouter api --- .../projects/_base/files/src/app/App.tsx | 17 +++--------- .../igr-ts/projects/_base/files/src/main.tsx | 20 +++++++++----- .../projects/top-nav/files/src/app/App.tsx | 26 ++++++------------- 3 files changed, 24 insertions(+), 39 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx index 4fee29c54..cc581fd47 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx @@ -1,22 +1,11 @@ -import { Route, Routes } from "react-router-dom"; -import { routes } from "./app-routes"; +import { Outlet } from "react-router-dom"; export default function App() { - function createRoutes(config) { - return config.map((route, index) => ( - - {route.children && createRoutes(route.children)} - - )); - } - return ( -
+
- - {createRoutes(routes)} - +
) diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx index 8bb76af22..cd7699009 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/main.tsx @@ -1,19 +1,25 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; -import { BrowserRouter as Router } from 'react-router-dom'; -import './index.css'; +import { createBrowserRouter, RouterProvider } from "react-router-dom"; +import { routes } from "./app/app-routes"; import App from './app/App'; import 'react-app-polyfill/ie11'; +import './index.css'; /** Required in IE11 for Charts */ Number.isNaN = Number.isNaN || function(value) { return value !== value; } +const router = createBrowserRouter([ + { + element: , + children: [...routes] + } +]); + ReactDOM.createRoot(document.getElementById('root')).render( - - - - - + + + ) diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx index 35d7a3398..7e1d3a0a9 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.tsx @@ -1,28 +1,18 @@ -import { Route, Routes } from "react-router-dom"; -import NavigationHeader from "../components/navigation-header"; +import { Outlet } from "react-router-dom"; import { routes } from './app-routes'; +import NavigationHeader from "../components/navigation-header"; import "./App.css"; export default function App() { const name = "$(name)"; - - function createRoutes(config) { - return config.map((route, i) => ( - - {route.children && createRoutes(route.children)} - - )); - } return ( -
-
{name}
- -
- - {createRoutes(routes)} - -
+
+
{name}
+ +
+
+
); } From 7ebd0e67aa33711dfb23af9d7a85986995444448 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 30 Nov 2023 12:11:43 +0200 Subject: [PATCH 58/66] chore: release 12.1.0-beta.4 --- packages/cli/package.json | 6 +++--- packages/core/package.json | 2 +- packages/igx-templates/package.json | 4 ++-- packages/ng-schematics/package.json | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index bf6e98196..6ca306408 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "igniteui-cli", - "version": "12.1.0-beta.3", + "version": "12.1.0-beta.4", "description": "CLI tool for creating Ignite UI projects", "keywords": [ "CLI", @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "~16.0.1210-beta.3", - "@igniteui/cli-core": "~12.1.0-beta.3", + "@igniteui/angular-templates": "^17.0.1210-beta.4", + "@igniteui/cli-core": "^12.1.0-beta.4", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/core/package.json b/packages/core/package.json index 3ab2c4412..c90485d44 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/cli-core", - "version": "12.1.0-beta.3", + "version": "12.1.0-beta.4", "description": "Base types and functionality for Ignite UI CLI", "repository": { "type": "git", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index d5259aeca..d110ccda8 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-templates", - "version": "16.0.1210-beta.3", + "version": "17.0.1210-beta.4", "description": "Templates for Ignite UI for Angular projects and components", "repository": { "type": "git", @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "~12.1.0-beta.3", + "@igniteui/cli-core": "^12.1.0-beta.4", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 45edfc3bf..37b9c53a3 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -1,6 +1,6 @@ { "name": "@igniteui/angular-schematics", - "version": "16.0.1210-beta.3", + "version": "17.0.1210-beta.4", "description": "Ignite UI for Angular Schematics for ng new and ng generate", "repository": { "type": "git", @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "~16.0.1210-beta.3", - "@igniteui/cli-core": "~12.1.0-beta.3", + "@igniteui/angular-templates": "^17.0.1210-beta.4", + "@igniteui/cli-core": "^12.1.0-beta.4", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From 9335cb6b98838eb9ab7bb82c8fa8fbaf643f88f6 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 30 Nov 2023 12:12:46 +0200 Subject: [PATCH 59/66] chore: fix package versions --- packages/cli/package.json | 4 ++-- packages/igx-templates/package.json | 2 +- packages/ng-schematics/package.json | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index 6ca306408..abd24920e 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -78,8 +78,8 @@ "all": true }, "dependencies": { - "@igniteui/angular-templates": "^17.0.1210-beta.4", - "@igniteui/cli-core": "^12.1.0-beta.4", + "@igniteui/angular-templates": "~17.0.1210-beta.4", + "@igniteui/cli-core": "~12.1.0-beta.4", "chalk": "^2.3.2", "fs-extra": "^3.0.1", "glob": "^7.1.2", diff --git a/packages/igx-templates/package.json b/packages/igx-templates/package.json index d110ccda8..cc96e691d 100644 --- a/packages/igx-templates/package.json +++ b/packages/igx-templates/package.json @@ -12,7 +12,7 @@ "author": "Infragistics", "license": "MIT", "dependencies": { - "@igniteui/cli-core": "^12.1.0-beta.4", + "@igniteui/cli-core": "~12.1.0-beta.4", "typescript": "~4.7.2" } } diff --git a/packages/ng-schematics/package.json b/packages/ng-schematics/package.json index 37b9c53a3..7997443dd 100644 --- a/packages/ng-schematics/package.json +++ b/packages/ng-schematics/package.json @@ -20,8 +20,8 @@ "dependencies": { "@angular-devkit/core": "~14.0.0", "@angular-devkit/schematics": "~14.0.0", - "@igniteui/angular-templates": "^17.0.1210-beta.4", - "@igniteui/cli-core": "^12.1.0-beta.4", + "@igniteui/angular-templates": "~17.0.1210-beta.4", + "@igniteui/cli-core": "~12.1.0-beta.4", "@schematics/angular": "~14.0.0", "rxjs": "^6.6.3" }, From dc0a1944e006663b768a8e27a118d478188292eb Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 7 Dec 2023 14:20:56 +0200 Subject: [PATCH 60/66] chore: address PR comments --- packages/cli/lib/commands/new.ts | 6 +- .../lib/templates/IgniteUIForReactTemplate.ts | 6 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../cli/templates/react/igr-ts/groups.json | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- .../igr-ts/projects/_base/files/README.md | 2 +- .../projects/_base/files/src/app/App.tsx | 2 +- .../projects/_base/files/src/setupTests.ts | 2 +- .../files/src/app/home/home.tsx | 17 +-- .../projects/top-nav/files/src/app/App.css | 119 +++++++++--------- .../src/app/__path__/__filePrefix__.test.tsx | 2 +- .../files/src/app/__path__/style.module.css | 2 +- 24 files changed, 97 insertions(+), 91 deletions(-) diff --git a/packages/cli/lib/commands/new.ts b/packages/cli/lib/commands/new.ts index 5049fa929..7c0359fdd 100644 --- a/packages/cli/lib/commands/new.ts +++ b/packages/cli/lib/commands/new.ts @@ -109,9 +109,9 @@ command = { const theme = projectLib.themes[themeIndex]; - const indexOfEmptyOrFirst = projectLib.projectIds.indexOf("empty") !== -1 ? - projectLib.projectIds.indexOf("empty") : - 0; + const indexOfEmptyOrFirst = projectLib.projectIds.indexOf("empty") !== -1 + ? projectLib.projectIds.indexOf("empty") + : 0; const projectTemplate = argv.template || projectLib.projectIds[indexOfEmptyOrFirst]; Util.log(`Project Name: ${argv.name}, framework ${argv.framework}, type ${projectLib.projectType}, theme ${theme}`); diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 3c5843e2b..8491a2789 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -66,13 +66,13 @@ export class IgniteUIForReactTemplate implements Template { } const routeModulePath: string = options.parentRoutingModulePath; - const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); - if (!(options && options.skipRoute) && App.container.get(FS_TOKEN) - .fileExists(routeModulePath)) { + if (!(options && options.skipRoute) + && App.container.get(FS_TOKEN).fileExists(routeModulePath)) { let nameFromPath = Util.nameFromPath(name); let lowerDashed = Util.lowerDashed(nameFromPath); let filePath = path.posix.join(projectPath, options.modulePath, `${lowerDashed}.tsx`); + const routingModule = new ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath)); if (defaultPath) { routingModule.addRoute("", options.className, nameFromPath, filePath, options.routerChildren, undefined); diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css index 1040e7ad7..b79b2ac27 100644 --- a/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/bullet-graph/default/files/src/app/__path__/style.module.css @@ -9,4 +9,4 @@ } :local(.graph) { width: 50%; -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css index b8c09ee23..d5f4be4a6 100644 --- a/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/category-chart/default/files/src/app/__path__/style.module.css @@ -6,4 +6,4 @@ } :local(.title) { color: rgb(0, 153, 255); -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css index bd4482f69..9bc1c8132 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/default/files/src/app/__path__/style.module.css @@ -6,4 +6,4 @@ } :local(.title) { color: rgb(0, 153, 255); -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css index 9aaa77850..2556f96e9 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/style.module.css @@ -7,4 +7,4 @@ } :local(.title) { color: rgb(0, 153, 255); -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css index bb0a0030d..4ed0c6a7b 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/style.module.css @@ -14,4 +14,4 @@ width: 80%; margin-bottom: 24px; border: 1px solid rgb(0, 153, 255); -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/groups.json b/packages/cli/templates/react/igr-ts/groups.json index 4d9ba21df..579789370 100644 --- a/packages/cli/templates/react/igr-ts/groups.json +++ b/packages/cli/templates/react/igr-ts/groups.json @@ -2,4 +2,4 @@ "Gauges": "scale measure Controls including Linear and Radial Gauge and Bullet Graph.", "Charts": "high-performance data visualization for category and financial data.", "Grids & Lists": "bind and display data sets with little coding or configuration." -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css index 31590f1ec..8c4e121fe 100644 --- a/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/linear-gauge/default/files/src/app/__path__/style.module.css @@ -9,4 +9,4 @@ } :local(.gauge) { width: 50%; -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css index bd4482f69..9bc1c8132 100644 --- a/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/pie-chart/default/files/src/app/__path__/style.module.css @@ -6,4 +6,4 @@ } :local(.title) { color: rgb(0, 153, 255); -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/README.md b/packages/cli/templates/react/igr-ts/projects/_base/files/README.md index dbf5fb8d1..d323aea07 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/README.md +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/README.md @@ -14,7 +14,7 @@ Run `ig build` to build the application into an output directory. ## Step by step mode -If you want to get a guided experience through the available options, you can initialize the step by step mode that will help you to create and setup your new application, as well as update project previously created with the Ignite UI CLI. To start the guide, simply run the `ig` command. +If you want to get a guided experience through the available options, you can initialize the step by step mode that will help you to create and setup your new application, as well as update a project previously created with the Ignite UI CLI. To start the guide, simply run the `ig` command. ## List templates diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx index cc581fd47..4514300d8 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/app/App.tsx @@ -9,4 +9,4 @@ export default function App() {
) -} \ No newline at end of file +} diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts index 698aeae9f..e17fdbb2e 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts @@ -2,4 +2,4 @@ import '@testing-library/jest-dom' import 'vitest-canvas-mock' import ResizeObserver from 'resize-observer-polyfill' -global.ResizeObserver = ResizeObserver \ No newline at end of file +global.ResizeObserver = ResizeObserver diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx index c9b6620f5..5c63f5190 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx @@ -1,21 +1,24 @@ -import logo from '/logo.svg'; -import styles from './style.module.css'; +import logo from "/logo.svg"; +import styles from "./style.module.css"; export default function App() { const name = "$(name)"; - return ( + + return (
-
{name}
+
{name}
logo

Welcome to Ignite UI for React!

- + rel="noopener noreferrer" + > Learn More
- ) + ); } diff --git a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css index fd9528478..41a9dc40f 100644 --- a/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css +++ b/packages/cli/templates/react/igr-ts/projects/top-nav/files/src/app/App.css @@ -1,59 +1,62 @@ .app { - text-align: center; - display: flex; - flex-flow: column; - min-height: 100vh; - } - - .content { - flex: 1 0 auto; - padding: 1em; - } - - /* quick nav menubar */ - nav, .app__name { - background-color: rgb(0, 153, 255); - box-sizing: border-box; - } - .app__name { - font-weight: 600; - font-size: 24px; - line-height: 32px; - padding-left: 24px; - text-align: left; - color: #FFF; - padding-bottom: 8px; - } - - nav ul { - list-style: none; - display: flex; - justify-content: flex-start; - flex-wrap: wrap; - margin: 0; - padding: 0; - } - - nav ul a { - color: #fff; - line-height: 2; - text-decoration: none; - margin: 0 5px; - } - - nav ul a.active { - color: #fff; - font-weight: 600; - } - nav ul li { - margin: 0px 16px; - box-sizing: border-box; - border-bottom: 1px solid transparent; - } - nav ul li.active { - border-bottom: 2px solid #fff; - } - nav ul li:not(.active):hover { - border-bottom: 1px solid #fff; - } - \ No newline at end of file + text-align: center; + display: flex; + flex-flow: column; + min-height: 100vh; +} + +.content { + flex: 1 0 auto; + padding: 1em; +} + +/* quick nav menubar */ +nav, +.app__name { + background-color: rgb(0, 153, 255); + box-sizing: border-box; +} +.app__name { + font-weight: 600; + font-size: 24px; + line-height: 32px; + padding-left: 24px; + text-align: left; + color: #fff; + padding-bottom: 8px; +} + +nav ul { + list-style: none; + display: flex; + justify-content: flex-start; + flex-wrap: wrap; + margin: 0; + padding: 0; +} + +nav ul a { + color: #fff; + line-height: 2; + text-decoration: none; + margin: 0 5px; +} + +nav ul a.active { + color: #fff; + font-weight: 600; +} + +nav ul li { + margin: 0px 16px; + box-sizing: border-box; + border-bottom: 1px solid transparent; +} + +nav ul li.active { + border-bottom: 2px solid #fff; +} + +nav ul li:not(.active):hover { + border-bottom: 1px solid #fff; +} diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx index 0dedf55d9..d8d91aeb3 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/__filePrefix__.test.tsx @@ -5,4 +5,4 @@ import $(ClassName) from './index'; test('renders $(ClassName) component', () => { const wrapper = render(<$(ClassName) />); expect(wrapper).toBeTruthy(); -}); \ No newline at end of file +}); diff --git a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css index 8ccb6dae7..215c1ac12 100644 --- a/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css +++ b/packages/cli/templates/react/igr-ts/radial-gauge/default/files/src/app/__path__/style.module.css @@ -9,4 +9,4 @@ } :local(.gauge) { width: 50%; -} \ No newline at end of file +} From 34bbe920b265b3227510ba67f4dd9d5abf28cde7 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 7 Dec 2023 14:23:20 +0200 Subject: [PATCH 61/66] chore: remove empty line --- packages/cli/templates/react/igr-ts/doughnut-chart/index.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts index 51143d9c2..c559896e3 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts @@ -1,4 +1,3 @@ - import { BaseComponent } from "@igniteui/cli-core"; class IgrTsDoughnutChartComponent extends BaseComponent { @@ -12,4 +11,4 @@ class IgrTsDoughnutChartComponent extends BaseComponent { this.description = `proportionally illustrate the occurrences of variables.`; } } -module.exports = new IgrTsDoughnutChartComponent(); +module.exports = new IgrTsDoughnutChartComponent(); \ No newline at end of file From 55d02583a103b7c9db7af32c3991c892f532cc51 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 7 Dec 2023 14:25:00 +0200 Subject: [PATCH 62/66] chore: add new line at the end --- packages/cli/templates/react/igr-ts/doughnut-chart/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts b/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts index c559896e3..ba6b1f565 100644 --- a/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts +++ b/packages/cli/templates/react/igr-ts/doughnut-chart/index.ts @@ -11,4 +11,4 @@ class IgrTsDoughnutChartComponent extends BaseComponent { this.description = `proportionally illustrate the occurrences of variables.`; } } -module.exports = new IgrTsDoughnutChartComponent(); \ No newline at end of file +module.exports = new IgrTsDoughnutChartComponent(); From 849d40cf7d0b457962055a1820f345a57d318358 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 7 Dec 2023 14:35:13 +0200 Subject: [PATCH 63/66] chore: fix indentation --- .../files/src/app/__path__/__filePrefix__.tsx | 90 +++++++++---------- .../projects/_base/files/src/setupTests.ts | 2 +- .../files/src/app/home/home.tsx | 36 ++++---- 3 files changed, 62 insertions(+), 66 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx index 58aa4c27f..a95142f97 100644 --- a/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx +++ b/packages/cli/templates/react/igr-ts/grid/basic/files/src/app/__path__/__filePrefix__.tsx @@ -10,53 +10,49 @@ IgrGridModule.register(); export default function $(ClassName)() { const title = 'Grid'; - return ( -
-

{title}

+ return (
- Read more on the  - - official documentation page - +

{title}

+
+ Read more on the  + + official documentation page + +
+
+
+ + + + + + + +
+
+ +
+
-
-
- - - - - - - - - - - - -
-
- -
-
-
- ) + ); } diff --git a/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts b/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts index e17fdbb2e..ecb3d50cf 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts +++ b/packages/cli/templates/react/igr-ts/projects/_base/files/src/setupTests.ts @@ -2,4 +2,4 @@ import '@testing-library/jest-dom' import 'vitest-canvas-mock' import ResizeObserver from 'resize-observer-polyfill' -global.ResizeObserver = ResizeObserver +global.ResizeObserver = ResizeObserver; diff --git a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx index 5c63f5190..11e371b21 100644 --- a/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx +++ b/packages/cli/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx @@ -2,23 +2,23 @@ import logo from "/logo.svg"; import styles from "./style.module.css"; export default function App() { - const name = "$(name)"; + const name = '$(name)'; - return ( -
-
{name}
-
- logo -

Welcome to Ignite UI for React!

- - Learn More - -
-
- ); + return ( +
+
{name}
+
+ logo +

Welcome to Ignite UI for React!

+ + Learn More + +
+
+ ); } From 2889e22bc379f6271b1327203852383775d9dc89 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Thu, 7 Dec 2023 14:37:55 +0200 Subject: [PATCH 64/66] chore: indent --- .../files/src/app/__path__/__filePrefix__.tsx | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx index 52d02b2e7..d0de3bf99 100644 --- a/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx +++ b/packages/cli/templates/react/igr-ts/financial-chart/default/files/src/app/__path__/__filePrefix__.tsx @@ -6,22 +6,22 @@ import style from './style.module.css'; IgrFinancialChartModule.register(); const data = [ - { time: new Date(2013, 1, 1), open: 268.93, high: 268.93, low: 262.80, close: 265.00, volume: 6118146 }, - { time: new Date(2013, 1, 4), open: 262.78, high: 264.68, low: 259.07, close: 259.98, volume: 3723793 }, - { time: new Date(2013, 1, 5), open: 262.00, high: 268.03, low: 261.46, close: 266.89, volume: 4013780 }, - { time: new Date(2013, 1, 6), open: 265.16, high: 266.89, low: 261.11, close: 262.22, volume: 2772204 }, - { time: new Date(2013, 1, 7), open: 264.10, high: 264.10, low: 255.11, close: 260.23, volume: 3977065 }, - { time: new Date(2013, 1, 8), open: 261.40, high: 265.25, low: 260.56, close: 261.95, volume: 3879628 }, - { time: new Date(2013, 1, 11), open: 263.20, high: 263.25, low: 256.60, close: 257.21, volume: 3407457 }, - { time: new Date(2013, 1, 12), open: 259.19, high: 260.16, low: 257.00, close: 258.70, volume: 2944730 }, - { time: new Date(2013, 1, 13), open: 261.53, high: 269.96, low: 260.30, close: 269.47, volume: 5295786 }, - { time: new Date(2013, 1, 14), open: 267.37, high: 270.65, low: 265.40, close: 269.24, volume: 3464080 }, - { time: new Date(2013, 1, 15), open: 267.63, high: 268.92, low: 263.11, close: 265.09, volume: 3981233 } + { time: new Date(2013, 1, 1), open: 268.93, high: 268.93, low: 262.80, close: 265.00, volume: 6118146 }, + { time: new Date(2013, 1, 4), open: 262.78, high: 264.68, low: 259.07, close: 259.98, volume: 3723793 }, + { time: new Date(2013, 1, 5), open: 262.00, high: 268.03, low: 261.46, close: 266.89, volume: 4013780 }, + { time: new Date(2013, 1, 6), open: 265.16, high: 266.89, low: 261.11, close: 262.22, volume: 2772204 }, + { time: new Date(2013, 1, 7), open: 264.10, high: 264.10, low: 255.11, close: 260.23, volume: 3977065 }, + { time: new Date(2013, 1, 8), open: 261.40, high: 265.25, low: 260.56, close: 261.95, volume: 3879628 }, + { time: new Date(2013, 1, 11), open: 263.20, high: 263.25, low: 256.60, close: 257.21, volume: 3407457 }, + { time: new Date(2013, 1, 12), open: 259.19, high: 260.16, low: 257.00, close: 258.70, volume: 2944730 }, + { time: new Date(2013, 1, 13), open: 261.53, high: 269.96, low: 260.30, close: 269.47, volume: 5295786 }, + { time: new Date(2013, 1, 14), open: 267.37, high: 270.65, low: 265.40, close: 269.24, volume: 3464080 }, + { time: new Date(2013, 1, 15), open: 267.63, high: 268.92, low: 263.11, close: 265.09, volume: 3981233 } ]; export default function $(ClassName)() { - const title = 'Financial Chart'; + const title = 'Financial Chart'; const [chartData, setChartData] = useState([]); useEffect(() => { From 1ef00de18b51479d95715931a3323754b442f5a2 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Fri, 8 Dec 2023 10:21:44 +0200 Subject: [PATCH 65/66] fix: igr-es6 project --- packages/cli/lib/commands/add.ts | 5 +++- .../lib/templates/IgniteUIForReactTemplate.ts | 29 +++++++++++++++++++ 2 files changed, 33 insertions(+), 1 deletion(-) diff --git a/packages/cli/lib/commands/add.ts b/packages/cli/lib/commands/add.ts index 990b38584..7f931dab1 100644 --- a/packages/cli/lib/commands/add.ts +++ b/packages/cli/lib/commands/add.ts @@ -118,10 +118,13 @@ command = { if (template.framework === "react") { options = { parentName: "app", - parentRoutingModulePath: "src/app/app-routes.tsx", className: Util.className(fileName), modulePath: `src/app/${Util.lowerDashed(fileName)}` }; + + options["parentRoutingModulePath"] = template.projectType === 'igr-ts' + ? "src/app/app-routes.tsx" + : "./src/routes.json"; } else { options = { parentName: "app", diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 8491a2789..7f9b424a2 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -9,6 +9,7 @@ import { Util } from "@igniteui/cli-core"; import * as path from "path"; +import * as fs from "fs-extra"; import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; export class IgniteUIForReactTemplate implements Template { @@ -65,6 +66,11 @@ export class IgniteUIForReactTemplate implements Template { return; } + if (this.projectType == 'igr-es6') { + this.registerJSONRoute(projectPath, name, options.parentRoutingModulePath); + return; + } + const routeModulePath: string = options.parentRoutingModulePath; if (!(options && options.skipRoute) @@ -130,4 +136,27 @@ export class IgniteUIForReactTemplate implements Template { } return Util.lowerDashed(folderName); } + + protected registerJSONRoute(projectPath: string, name: string, routingModulePath: string) { + const configFile = fs.readFileSync(path.join(projectPath, routingModulePath), "utf8"); + const viewsArr = JSON.parse(configFile); + viewsArr.push({ + componentPath: this.getViewLink(name), + path: "/" + this.folderName(Util.nameFromPath(name)), + text: this.getToolbarLink(name) + }); + + fs.writeFileSync(path.join(projectPath, routingModulePath), JSON.stringify(viewsArr, null, 4)); + } + + protected getViewLink(name: string): string { + const filePath = "./views/" + this.folderName(name); + return filePath; + } + + protected getToolbarLink(name: string): string { + name = Util.nameFromPath(name); + const toolbarLink = name.replace(/\w\S*/g, txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()); + return toolbarLink; + } } From 0cbfbf643fe090c5e14dd6673beacecace685217 Mon Sep 17 00:00:00 2001 From: onlyexeption Date: Fri, 8 Dec 2023 11:00:53 +0200 Subject: [PATCH 66/66] chore: fix lint --- packages/cli/lib/commands/add.ts | 2 +- packages/cli/lib/templates/IgniteUIForReactTemplate.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/cli/lib/commands/add.ts b/packages/cli/lib/commands/add.ts index 7f931dab1..9409c22f5 100644 --- a/packages/cli/lib/commands/add.ts +++ b/packages/cli/lib/commands/add.ts @@ -122,7 +122,7 @@ command = { modulePath: `src/app/${Util.lowerDashed(fileName)}` }; - options["parentRoutingModulePath"] = template.projectType === 'igr-ts' + options["parentRoutingModulePath"] = template.projectType === "igr-ts" ? "src/app/app-routes.tsx" : "./src/routes.json"; } else { diff --git a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts index 7f9b424a2..461633f42 100644 --- a/packages/cli/lib/templates/IgniteUIForReactTemplate.ts +++ b/packages/cli/lib/templates/IgniteUIForReactTemplate.ts @@ -8,8 +8,8 @@ import { Template, Util } from "@igniteui/cli-core"; -import * as path from "path"; import * as fs from "fs-extra"; +import * as path from "path"; import { ReactTypeScriptFileUpdate } from "../../templates/react/ReactTypeScriptFileUpdate"; export class IgniteUIForReactTemplate implements Template { @@ -66,7 +66,7 @@ export class IgniteUIForReactTemplate implements Template { return; } - if (this.projectType == 'igr-es6') { + if (this.projectType === "igr-es6") { this.registerJSONRoute(projectPath, name, options.parentRoutingModulePath); return; }