@backstage/cli-module-new 0.1.2-next.2 → 0.1.3-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +21 -0
- package/dist/lib/version.cjs.js +38 -36
- package/dist/lib/version.cjs.js.map +1 -1
- package/dist/packages/backend-defaults/package.json.cjs.js +1 -1
- package/dist/packages/backend-plugin-api/package.json.cjs.js +1 -1
- package/dist/packages/backend-test-utils/package.json.cjs.js +1 -1
- package/dist/packages/catalog-client/package.json.cjs.js +1 -1
- package/dist/packages/cli/package.json.cjs.js +1 -1
- package/dist/packages/cli-module-new/package.json.cjs.js +1 -1
- package/dist/packages/config/package.json.cjs.js +1 -1
- package/dist/packages/core-app-api/package.json.cjs.js +1 -1
- package/dist/packages/core-components/package.json.cjs.js +1 -1
- package/dist/packages/core-plugin-api/package.json.cjs.js +1 -1
- package/dist/packages/dev-utils/package.json.cjs.js +1 -1
- package/dist/packages/errors/package.json.cjs.js +1 -1
- package/dist/packages/frontend-defaults/package.json.cjs.js +1 -1
- package/dist/packages/frontend-dev-utils/package.json.cjs.js +1 -1
- package/dist/packages/frontend-plugin-api/package.json.cjs.js +1 -1
- package/dist/packages/frontend-test-utils/package.json.cjs.js +1 -1
- package/dist/packages/test-utils/package.json.cjs.js +1 -1
- package/dist/packages/theme/package.json.cjs.js +1 -1
- package/dist/packages/ui/package.json.cjs.js +6 -0
- package/dist/packages/ui/package.json.cjs.js.map +1 -0
- package/dist/plugins/auth-backend/package.json.cjs.js +1 -1
- package/dist/plugins/auth-backend-module-guest-provider/package.json.cjs.js +1 -1
- package/dist/plugins/catalog-node/package.json.cjs.js +1 -1
- package/dist/plugins/scaffolder-node/package.json.cjs.js +1 -1
- package/dist/plugins/scaffolder-node-test-utils/package.json.cjs.js +1 -1
- package/package.json +8 -8
- package/templates/frontend-plugin/README.md.hbs +1 -1
- package/templates/frontend-plugin/package.json.hbs +1 -3
- package/templates/frontend-plugin/src/components/TodoList/TodoList.test.tsx +18 -0
- package/templates/frontend-plugin/src/components/TodoList/TodoList.tsx +42 -0
- package/templates/frontend-plugin/src/components/TodoList/index.ts +2 -0
- package/templates/frontend-plugin/src/components/TodoPage/TodoPage.test.tsx.hbs +43 -0
- package/templates/frontend-plugin/src/components/TodoPage/TodoPage.tsx.hbs +52 -0
- package/templates/frontend-plugin/src/components/TodoPage/index.ts +1 -0
- package/templates/frontend-plugin/src/plugin.tsx.hbs +3 -3
- package/templates/frontend-plugin/src/components/ExampleComponent/ExampleComponent.test.tsx.hbs +0 -28
- package/templates/frontend-plugin/src/components/ExampleComponent/ExampleComponent.tsx.hbs +0 -37
- package/templates/frontend-plugin/src/components/ExampleComponent/index.ts +0 -1
- package/templates/frontend-plugin/src/components/ExampleFetchComponent/ExampleFetchComponent.test.tsx.hbs +0 -19
- package/templates/frontend-plugin/src/components/ExampleFetchComponent/ExampleFetchComponent.tsx.hbs +0 -308
- package/templates/frontend-plugin/src/components/ExampleFetchComponent/index.ts +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,26 @@
|
|
|
1
1
|
# @backstage/cli-module-new
|
|
2
2
|
|
|
3
|
+
## 0.1.3-next.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
- @backstage/errors@1.3.1-next.0
|
|
9
|
+
- @backstage/cli-common@0.2.2-next.0
|
|
10
|
+
- @backstage/cli-node@0.3.2-next.0
|
|
11
|
+
|
|
12
|
+
## 0.1.2
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- 64a91d0: Rename the legacy `frontend-plugin` to `frontend-plugin-legacy`
|
|
17
|
+
- 482ceed: Migrated from `assertError` to `toError` for error handling.
|
|
18
|
+
- 2b4f97a: Updated frontend-plugin template to provide a todo list visualization compatible with the backend plugin.
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
- @backstage/errors@1.3.0
|
|
21
|
+
- @backstage/cli-common@0.2.1
|
|
22
|
+
- @backstage/cli-node@0.3.1
|
|
23
|
+
|
|
3
24
|
## 0.1.2-next.2
|
|
4
25
|
|
|
5
26
|
### Patch Changes
|
package/dist/lib/version.cjs.js
CHANGED
|
@@ -1,24 +1,25 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var semver = require('semver');
|
|
4
|
-
var _package$
|
|
5
|
-
var _package$
|
|
6
|
-
var _package$
|
|
7
|
-
var _package$
|
|
8
|
-
var _package$
|
|
9
|
-
var _package$
|
|
10
|
-
var _package$
|
|
11
|
-
var _package$
|
|
12
|
-
var _package$
|
|
13
|
-
var _package$
|
|
14
|
-
var _package$
|
|
15
|
-
var _package$
|
|
16
|
-
var _package$
|
|
17
|
-
var _package$
|
|
18
|
-
var _package$
|
|
19
|
-
var _package$
|
|
20
|
-
var _package$
|
|
21
|
-
var _package$
|
|
4
|
+
var _package$n = require('../packages/backend-defaults/package.json.cjs.js');
|
|
5
|
+
var _package$m = require('../packages/backend-plugin-api/package.json.cjs.js');
|
|
6
|
+
var _package$l = require('../packages/backend-test-utils/package.json.cjs.js');
|
|
7
|
+
var _package$k = require('../packages/catalog-client/package.json.cjs.js');
|
|
8
|
+
var _package$j = require('../packages/cli/package.json.cjs.js');
|
|
9
|
+
var _package$i = require('../packages/config/package.json.cjs.js');
|
|
10
|
+
var _package$h = require('../packages/core-app-api/package.json.cjs.js');
|
|
11
|
+
var _package$g = require('../packages/core-components/package.json.cjs.js');
|
|
12
|
+
var _package$f = require('../packages/core-plugin-api/package.json.cjs.js');
|
|
13
|
+
var _package$e = require('../packages/dev-utils/package.json.cjs.js');
|
|
14
|
+
var _package$d = require('../packages/errors/package.json.cjs.js');
|
|
15
|
+
var _package$c = require('../packages/frontend-dev-utils/package.json.cjs.js');
|
|
16
|
+
var _package$b = require('../packages/frontend-defaults/package.json.cjs.js');
|
|
17
|
+
var _package$a = require('../packages/frontend-plugin-api/package.json.cjs.js');
|
|
18
|
+
var _package$9 = require('../packages/frontend-test-utils/package.json.cjs.js');
|
|
19
|
+
var _package$8 = require('../packages/test-utils/package.json.cjs.js');
|
|
20
|
+
var _package$7 = require('../packages/theme/package.json.cjs.js');
|
|
21
|
+
var _package$6 = require('../packages/types/package.json.cjs.js');
|
|
22
|
+
var _package$5 = require('../packages/ui/package.json.cjs.js');
|
|
22
23
|
var _package$2 = require('../plugins/auth-backend/package.json.cjs.js');
|
|
23
24
|
var _package$1 = require('../plugins/auth-backend-module-guest-provider/package.json.cjs.js');
|
|
24
25
|
var _package = require('../plugins/catalog-node/package.json.cjs.js');
|
|
@@ -30,24 +31,25 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
30
31
|
var semver__default = /*#__PURE__*/_interopDefaultCompat(semver);
|
|
31
32
|
|
|
32
33
|
const packageVersions = {
|
|
33
|
-
"@backstage/backend-defaults": _package$
|
|
34
|
-
"@backstage/backend-plugin-api": _package$
|
|
35
|
-
"@backstage/backend-test-utils": _package$
|
|
36
|
-
"@backstage/catalog-client": _package$
|
|
37
|
-
"@backstage/cli": _package$
|
|
38
|
-
"@backstage/config": _package$
|
|
39
|
-
"@backstage/core-app-api": _package$
|
|
40
|
-
"@backstage/core-components": _package$
|
|
41
|
-
"@backstage/core-plugin-api": _package$
|
|
42
|
-
"@backstage/dev-utils": _package$
|
|
43
|
-
"@backstage/errors": _package$
|
|
44
|
-
"@backstage/frontend-dev-utils": _package$
|
|
45
|
-
"@backstage/frontend-defaults": _package$
|
|
46
|
-
"@backstage/frontend-plugin-api": _package$
|
|
47
|
-
"@backstage/frontend-test-utils": _package$
|
|
48
|
-
"@backstage/test-utils": _package$
|
|
49
|
-
"@backstage/theme": _package$
|
|
50
|
-
"@backstage/types": _package$
|
|
34
|
+
"@backstage/backend-defaults": _package$n.version,
|
|
35
|
+
"@backstage/backend-plugin-api": _package$m.version,
|
|
36
|
+
"@backstage/backend-test-utils": _package$l.version,
|
|
37
|
+
"@backstage/catalog-client": _package$k.version,
|
|
38
|
+
"@backstage/cli": _package$j.version,
|
|
39
|
+
"@backstage/config": _package$i.version,
|
|
40
|
+
"@backstage/core-app-api": _package$h.version,
|
|
41
|
+
"@backstage/core-components": _package$g.version,
|
|
42
|
+
"@backstage/core-plugin-api": _package$f.version,
|
|
43
|
+
"@backstage/dev-utils": _package$e.version,
|
|
44
|
+
"@backstage/errors": _package$d.version,
|
|
45
|
+
"@backstage/frontend-dev-utils": _package$c.version,
|
|
46
|
+
"@backstage/frontend-defaults": _package$b.version,
|
|
47
|
+
"@backstage/frontend-plugin-api": _package$a.version,
|
|
48
|
+
"@backstage/frontend-test-utils": _package$9.version,
|
|
49
|
+
"@backstage/test-utils": _package$8.version,
|
|
50
|
+
"@backstage/theme": _package$7.version,
|
|
51
|
+
"@backstage/types": _package$6.version,
|
|
52
|
+
"@backstage/ui": _package$5.version,
|
|
51
53
|
"@backstage/plugin-scaffolder-node": _package$4.version,
|
|
52
54
|
"@backstage/plugin-scaffolder-node-test-utils": _package$3.version,
|
|
53
55
|
"@backstage/plugin-auth-backend": _package$2.version,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.cjs.js","sources":["../../src/lib/version.ts"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport semver from 'semver';\nimport { Lockfile } from '@backstage/cli-node';\n\n/* eslint-disable @backstage/no-relative-monorepo-imports */\n/*\nThis is a list of all packages used by the templates. If dependencies are added or removed,\nthis list should be updated as well.\n\nThe list, and the accompanying devDependencies entries, are here to ensure correct versioning\nand bumping of this package. Without this list the version would not be bumped unless we\nmanually trigger a release.\n\nThis does not create an actual dependency on these packages and does not bring in any code.\nRollup will extract the value of the version field in each package at build time without\nleaving any imports in place.\n*/\n\nimport { version as backendDefaults } from '../../../backend-defaults/package.json';\nimport { version as backendPluginApi } from '../../../backend-plugin-api/package.json';\nimport { version as backendTestUtils } from '../../../backend-test-utils/package.json';\nimport { version as catalogClient } from '../../../catalog-client/package.json';\nimport { version as cli } from '../../../cli/package.json';\nimport { version as config } from '../../../config/package.json';\nimport { version as coreAppApi } from '../../../core-app-api/package.json';\nimport { version as coreComponents } from '../../../core-components/package.json';\nimport { version as corePluginApi } from '../../../core-plugin-api/package.json';\nimport { version as devUtils } from '../../../dev-utils/package.json';\nimport { version as errors } from '../../../errors/package.json';\nimport { version as frontendDevUtils } from '../../../frontend-dev-utils/package.json';\nimport { version as frontendDefaults } from '../../../frontend-defaults/package.json';\nimport { version as frontendPluginApi } from '../../../frontend-plugin-api/package.json';\nimport { version as frontendTestUtils } from '../../../frontend-test-utils/package.json';\nimport { version as testUtils } from '../../../test-utils/package.json';\nimport { version as theme } from '../../../theme/package.json';\nimport { version as types } from '../../../types/package.json';\nimport { version as authBackend } from '../../../../plugins/auth-backend/package.json';\nimport { version as authBackendModuleGuestProvider } from '../../../../plugins/auth-backend-module-guest-provider/package.json';\nimport { version as catalogNode } from '../../../../plugins/catalog-node/package.json';\nimport { version as scaffolderNode } from '../../../../plugins/scaffolder-node/package.json';\nimport { version as scaffolderNodeTestUtils } from '../../../../plugins/scaffolder-node-test-utils/package.json';\n\nexport const packageVersions: Record<string, string> = {\n '@backstage/backend-defaults': backendDefaults,\n '@backstage/backend-plugin-api': backendPluginApi,\n '@backstage/backend-test-utils': backendTestUtils,\n '@backstage/catalog-client': catalogClient,\n '@backstage/cli': cli,\n '@backstage/config': config,\n '@backstage/core-app-api': coreAppApi,\n '@backstage/core-components': coreComponents,\n '@backstage/core-plugin-api': corePluginApi,\n '@backstage/dev-utils': devUtils,\n '@backstage/errors': errors,\n '@backstage/frontend-dev-utils': frontendDevUtils,\n '@backstage/frontend-defaults': frontendDefaults,\n '@backstage/frontend-plugin-api': frontendPluginApi,\n '@backstage/frontend-test-utils': frontendTestUtils,\n '@backstage/test-utils': testUtils,\n '@backstage/theme': theme,\n '@backstage/types': types,\n '@backstage/plugin-scaffolder-node': scaffolderNode,\n '@backstage/plugin-scaffolder-node-test-utils': scaffolderNodeTestUtils,\n '@backstage/plugin-auth-backend': authBackend,\n '@backstage/plugin-auth-backend-module-guest-provider':\n authBackendModuleGuestProvider,\n '@backstage/plugin-catalog-node': catalogNode,\n};\n\nexport function createPackageVersionProvider(\n lockfile?: Lockfile,\n options?: {\n preferBackstageProtocol?: boolean;\n },\n) {\n return (name: string, versionHint?: string): string => {\n const packageVersion = packageVersions[name];\n\n // 1) workspace precedence (existing logic) - check this first\n const lockfileEntries = lockfile?.get(name);\n const lockfileEntry = lockfileEntries?.find(entry =>\n entry.range.startsWith('workspace:'),\n );\n if (lockfileEntry) {\n return 'workspace:^';\n }\n\n // 2) backstage:^ when plugin is present and allowed\n if (options?.preferBackstageProtocol && name.startsWith('@backstage/')) {\n return 'backstage:^';\n }\n\n // 3) fallback to current npm resolution\n const targetVersion = versionHint || packageVersion;\n if (!targetVersion) {\n throw new Error(`No version available for package ${name}`);\n }\n\n const validRanges = lockfileEntries?.filter(entry =>\n semver.satisfies(targetVersion, entry.range),\n );\n const highestRange = validRanges?.slice(-1)[0];\n\n if (highestRange?.range) {\n return highestRange?.range;\n }\n if (packageVersion) {\n return `^${packageVersion}`;\n }\n if (semver.parse(versionHint)?.prerelease.length) {\n return versionHint!;\n }\n return versionHint?.match(/^[\\d\\.]+$/) ? `^${versionHint}` : versionHint!;\n };\n}\n"],"names":["backendDefaults","backendPluginApi","backendTestUtils","catalogClient","cli","config","coreAppApi","coreComponents","corePluginApi","devUtils","errors","frontendDevUtils","frontendDefaults","frontendPluginApi","frontendTestUtils","testUtils","theme","types","scaffolderNode","scaffolderNodeTestUtils","authBackend","authBackendModuleGuestProvider","catalogNode","semver"],"mappings":"
|
|
1
|
+
{"version":3,"file":"version.cjs.js","sources":["../../src/lib/version.ts"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport semver from 'semver';\nimport { Lockfile } from '@backstage/cli-node';\n\n/* eslint-disable @backstage/no-relative-monorepo-imports */\n/*\nThis is a list of all packages used by the templates. If dependencies are added or removed,\nthis list should be updated as well.\n\nThe list, and the accompanying devDependencies entries, are here to ensure correct versioning\nand bumping of this package. Without this list the version would not be bumped unless we\nmanually trigger a release.\n\nThis does not create an actual dependency on these packages and does not bring in any code.\nRollup will extract the value of the version field in each package at build time without\nleaving any imports in place.\n*/\n\nimport { version as backendDefaults } from '../../../backend-defaults/package.json';\nimport { version as backendPluginApi } from '../../../backend-plugin-api/package.json';\nimport { version as backendTestUtils } from '../../../backend-test-utils/package.json';\nimport { version as catalogClient } from '../../../catalog-client/package.json';\nimport { version as cli } from '../../../cli/package.json';\nimport { version as config } from '../../../config/package.json';\nimport { version as coreAppApi } from '../../../core-app-api/package.json';\nimport { version as coreComponents } from '../../../core-components/package.json';\nimport { version as corePluginApi } from '../../../core-plugin-api/package.json';\nimport { version as devUtils } from '../../../dev-utils/package.json';\nimport { version as errors } from '../../../errors/package.json';\nimport { version as frontendDevUtils } from '../../../frontend-dev-utils/package.json';\nimport { version as frontendDefaults } from '../../../frontend-defaults/package.json';\nimport { version as frontendPluginApi } from '../../../frontend-plugin-api/package.json';\nimport { version as frontendTestUtils } from '../../../frontend-test-utils/package.json';\nimport { version as testUtils } from '../../../test-utils/package.json';\nimport { version as theme } from '../../../theme/package.json';\nimport { version as types } from '../../../types/package.json';\nimport { version as ui } from '../../../ui/package.json';\nimport { version as authBackend } from '../../../../plugins/auth-backend/package.json';\nimport { version as authBackendModuleGuestProvider } from '../../../../plugins/auth-backend-module-guest-provider/package.json';\nimport { version as catalogNode } from '../../../../plugins/catalog-node/package.json';\nimport { version as scaffolderNode } from '../../../../plugins/scaffolder-node/package.json';\nimport { version as scaffolderNodeTestUtils } from '../../../../plugins/scaffolder-node-test-utils/package.json';\n\nexport const packageVersions: Record<string, string> = {\n '@backstage/backend-defaults': backendDefaults,\n '@backstage/backend-plugin-api': backendPluginApi,\n '@backstage/backend-test-utils': backendTestUtils,\n '@backstage/catalog-client': catalogClient,\n '@backstage/cli': cli,\n '@backstage/config': config,\n '@backstage/core-app-api': coreAppApi,\n '@backstage/core-components': coreComponents,\n '@backstage/core-plugin-api': corePluginApi,\n '@backstage/dev-utils': devUtils,\n '@backstage/errors': errors,\n '@backstage/frontend-dev-utils': frontendDevUtils,\n '@backstage/frontend-defaults': frontendDefaults,\n '@backstage/frontend-plugin-api': frontendPluginApi,\n '@backstage/frontend-test-utils': frontendTestUtils,\n '@backstage/test-utils': testUtils,\n '@backstage/theme': theme,\n '@backstage/types': types,\n '@backstage/ui': ui,\n '@backstage/plugin-scaffolder-node': scaffolderNode,\n '@backstage/plugin-scaffolder-node-test-utils': scaffolderNodeTestUtils,\n '@backstage/plugin-auth-backend': authBackend,\n '@backstage/plugin-auth-backend-module-guest-provider':\n authBackendModuleGuestProvider,\n '@backstage/plugin-catalog-node': catalogNode,\n};\n\nexport function createPackageVersionProvider(\n lockfile?: Lockfile,\n options?: {\n preferBackstageProtocol?: boolean;\n },\n) {\n return (name: string, versionHint?: string): string => {\n const packageVersion = packageVersions[name];\n\n // 1) workspace precedence (existing logic) - check this first\n const lockfileEntries = lockfile?.get(name);\n const lockfileEntry = lockfileEntries?.find(entry =>\n entry.range.startsWith('workspace:'),\n );\n if (lockfileEntry) {\n return 'workspace:^';\n }\n\n // 2) backstage:^ when plugin is present and allowed\n if (options?.preferBackstageProtocol && name.startsWith('@backstage/')) {\n return 'backstage:^';\n }\n\n // 3) fallback to current npm resolution\n const targetVersion = versionHint || packageVersion;\n if (!targetVersion) {\n throw new Error(`No version available for package ${name}`);\n }\n\n const validRanges = lockfileEntries?.filter(entry =>\n semver.satisfies(targetVersion, entry.range),\n );\n const highestRange = validRanges?.slice(-1)[0];\n\n if (highestRange?.range) {\n return highestRange?.range;\n }\n if (packageVersion) {\n return `^${packageVersion}`;\n }\n if (semver.parse(versionHint)?.prerelease.length) {\n return versionHint!;\n }\n return versionHint?.match(/^[\\d\\.]+$/) ? `^${versionHint}` : versionHint!;\n };\n}\n"],"names":["backendDefaults","backendPluginApi","backendTestUtils","catalogClient","cli","config","coreAppApi","coreComponents","corePluginApi","devUtils","errors","frontendDevUtils","frontendDefaults","frontendPluginApi","frontendTestUtils","testUtils","theme","types","ui","scaffolderNode","scaffolderNodeTestUtils","authBackend","authBackendModuleGuestProvider","catalogNode","semver"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DO,MAAM,eAAA,GAA0C;AAAA,EACrD,6BAAA,EAA+BA,kBAAA;AAAA,EAC/B,+BAAA,EAAiCC,kBAAA;AAAA,EACjC,+BAAA,EAAiCC,kBAAA;AAAA,EACjC,2BAAA,EAA6BC,kBAAA;AAAA,EAC7B,gBAAA,EAAkBC,kBAAA;AAAA,EAClB,mBAAA,EAAqBC,kBAAA;AAAA,EACrB,yBAAA,EAA2BC,kBAAA;AAAA,EAC3B,4BAAA,EAA8BC,kBAAA;AAAA,EAC9B,4BAAA,EAA8BC,kBAAA;AAAA,EAC9B,sBAAA,EAAwBC,kBAAA;AAAA,EACxB,mBAAA,EAAqBC,kBAAA;AAAA,EACrB,+BAAA,EAAiCC,kBAAA;AAAA,EACjC,8BAAA,EAAgCC,kBAAA;AAAA,EAChC,gCAAA,EAAkCC,kBAAA;AAAA,EAClC,gCAAA,EAAkCC,kBAAA;AAAA,EAClC,uBAAA,EAAyBC,kBAAA;AAAA,EACzB,kBAAA,EAAoBC,kBAAA;AAAA,EACpB,kBAAA,EAAoBC,kBAAA;AAAA,EACpB,eAAA,EAAiBC,kBAAA;AAAA,EACjB,mCAAA,EAAqCC,kBAAA;AAAA,EACrC,8CAAA,EAAgDC,kBAAA;AAAA,EAChD,gCAAA,EAAkCC,kBAAA;AAAA,EAClC,sDAAA,EACEC,kBAAA;AAAA,EACF,gCAAA,EAAkCC;AACpC;AAEO,SAAS,4BAAA,CACd,UACA,OAAA,EAGA;AACA,EAAA,OAAO,CAAC,MAAc,WAAA,KAAiC;AACrD,IAAA,MAAM,cAAA,GAAiB,gBAAgB,IAAI,CAAA;AAG3C,IAAA,MAAM,eAAA,GAAkB,QAAA,EAAU,GAAA,CAAI,IAAI,CAAA;AAC1C,IAAA,MAAM,gBAAgB,eAAA,EAAiB,IAAA;AAAA,MAAK,CAAA,KAAA,KAC1C,KAAA,CAAM,KAAA,CAAM,UAAA,CAAW,YAAY;AAAA,KACrC;AACA,IAAA,IAAI,aAAA,EAAe;AACjB,MAAA,OAAO,aAAA;AAAA,IACT;AAGA,IAAA,IAAI,OAAA,EAAS,uBAAA,IAA2B,IAAA,CAAK,UAAA,CAAW,aAAa,CAAA,EAAG;AACtE,MAAA,OAAO,aAAA;AAAA,IACT;AAGA,IAAA,MAAM,gBAAgB,WAAA,IAAe,cAAA;AACrC,IAAA,IAAI,CAAC,aAAA,EAAe;AAClB,MAAA,MAAM,IAAI,KAAA,CAAM,CAAA,iCAAA,EAAoC,IAAI,CAAA,CAAE,CAAA;AAAA,IAC5D;AAEA,IAAA,MAAM,cAAc,eAAA,EAAiB,MAAA;AAAA,MAAO,CAAA,KAAA,KAC1CC,uBAAA,CAAO,SAAA,CAAU,aAAA,EAAe,MAAM,KAAK;AAAA,KAC7C;AACA,IAAA,MAAM,YAAA,GAAe,WAAA,EAAa,KAAA,CAAM,EAAE,EAAE,CAAC,CAAA;AAE7C,IAAA,IAAI,cAAc,KAAA,EAAO;AACvB,MAAA,OAAO,YAAA,EAAc,KAAA;AAAA,IACvB;AACA,IAAA,IAAI,cAAA,EAAgB;AAClB,MAAA,OAAO,IAAI,cAAc,CAAA,CAAA;AAAA,IAC3B;AACA,IAAA,IAAIA,uBAAA,CAAO,KAAA,CAAM,WAAW,CAAA,EAAG,WAAW,MAAA,EAAQ;AAChD,MAAA,OAAO,WAAA;AAAA,IACT;AACA,IAAA,OAAO,aAAa,KAAA,CAAM,WAAW,CAAA,GAAI,CAAA,CAAA,EAAI,WAAW,CAAA,CAAA,GAAK,WAAA;AAAA,EAC/D,CAAA;AACF;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"package.json.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage/cli-module-new",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3-next.0",
|
|
4
4
|
"description": "CLI module for Backstage CLI",
|
|
5
5
|
"backstage": {
|
|
6
6
|
"role": "cli-module"
|
|
@@ -34,9 +34,9 @@
|
|
|
34
34
|
"test": "backstage-cli package test"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@backstage/cli-common": "0.2.
|
|
38
|
-
"@backstage/cli-node": "0.3.
|
|
39
|
-
"@backstage/errors": "1.3.
|
|
37
|
+
"@backstage/cli-common": "0.2.2-next.0",
|
|
38
|
+
"@backstage/cli-node": "0.3.2-next.0",
|
|
39
|
+
"@backstage/errors": "1.3.1-next.0",
|
|
40
40
|
"chalk": "^4.0.0",
|
|
41
41
|
"cleye": "^2.3.0",
|
|
42
42
|
"fs-extra": "^11.2.0",
|
|
@@ -51,10 +51,10 @@
|
|
|
51
51
|
"zod-validation-error": "^4.0.2"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@backstage/backend-test-utils": "1.11.
|
|
55
|
-
"@backstage/cli": "0.36.
|
|
56
|
-
"@backstage/core-plugin-api": "1.12.
|
|
57
|
-
"@backstage/test-utils": "1.7.
|
|
54
|
+
"@backstage/backend-test-utils": "1.11.3-next.0",
|
|
55
|
+
"@backstage/cli": "0.36.2-next.0",
|
|
56
|
+
"@backstage/core-plugin-api": "1.12.6-next.0",
|
|
57
|
+
"@backstage/test-utils": "1.7.18-next.0",
|
|
58
58
|
"@types/fs-extra": "^11.0.0",
|
|
59
59
|
"@types/inquirer": "^8.1.3",
|
|
60
60
|
"@types/lodash": "^4.14.151",
|
|
@@ -10,7 +10,7 @@ Your plugin has been added to the app in this repository, meaning you'll be able
|
|
|
10
10
|
to access it by running `yarn start` in the root directory, and then navigating
|
|
11
11
|
to [/{{pluginId}}](http://localhost:3000/{{pluginId}}).
|
|
12
12
|
|
|
13
|
-
This plugin is built with Backstage's [
|
|
13
|
+
This plugin is built with Backstage's [frontend
|
|
14
14
|
system](https://backstage.io/docs/frontend-system/architecture/index), and you
|
|
15
15
|
can find more information about building plugins in the [plugin builder
|
|
16
16
|
documentation](https://backstage.io/docs/frontend-system/building-plugins/index).
|
|
@@ -25,9 +25,7 @@
|
|
|
25
25
|
"@backstage/core-components": "{{versionQuery '@backstage/core-components'}}",
|
|
26
26
|
"@backstage/frontend-plugin-api": "{{versionQuery '@backstage/frontend-plugin-api'}}",
|
|
27
27
|
"@backstage/theme": "{{versionQuery '@backstage/theme'}}",
|
|
28
|
-
"@
|
|
29
|
-
"@material-ui/icons": "{{versionQuery '@material-ui/icons' '4.9.1'}}",
|
|
30
|
-
"@material-ui/lab": "{{versionQuery '@material-ui/lab' '4.0.0-alpha.61'}}",
|
|
28
|
+
"@backstage/ui": "{{versionQuery '@backstage/ui'}}",
|
|
31
29
|
"react-use": "{{versionQuery 'react-use' '17.2.4'}}"
|
|
32
30
|
},
|
|
33
31
|
"peerDependencies": {
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { screen } from '@testing-library/react';
|
|
2
|
+
import { renderInTestApp } from '@backstage/frontend-test-utils';
|
|
3
|
+
import { TodoList } from './TodoList';
|
|
4
|
+
|
|
5
|
+
describe('TodoList', () => {
|
|
6
|
+
it('renders a list of todos', async () => {
|
|
7
|
+
const todos = [
|
|
8
|
+
{ id: '1', title: 'First task', createdBy: 'user:default/guest', createdAt: '2025-01-01T00:00:00.000Z' },
|
|
9
|
+
{ id: '2', title: 'Second task', createdBy: 'user:default/admin', createdAt: '2025-01-02T00:00:00.000Z' },
|
|
10
|
+
];
|
|
11
|
+
|
|
12
|
+
await renderInTestApp(<TodoList todos={todos} />);
|
|
13
|
+
|
|
14
|
+
expect(await screen.findByText('First task')).toBeInTheDocument();
|
|
15
|
+
expect(await screen.findByText('Second task')).toBeInTheDocument();
|
|
16
|
+
expect(await screen.findByText('user:default/guest')).toBeInTheDocument();
|
|
17
|
+
});
|
|
18
|
+
});
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { Table, useTable, CellText, type ColumnConfig } from '@backstage/ui';
|
|
2
|
+
|
|
3
|
+
export type TodoItem = {
|
|
4
|
+
title: string;
|
|
5
|
+
id: string;
|
|
6
|
+
createdBy: string;
|
|
7
|
+
createdAt: string;
|
|
8
|
+
};
|
|
9
|
+
|
|
10
|
+
const columns: ColumnConfig<TodoItem>[] = [
|
|
11
|
+
{
|
|
12
|
+
id: 'title',
|
|
13
|
+
label: 'Title',
|
|
14
|
+
cell: item => <CellText title={item.title} />,
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
id: 'createdBy',
|
|
18
|
+
label: 'Created by',
|
|
19
|
+
cell: item => <CellText title={item.createdBy} />,
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
id: 'createdAt',
|
|
23
|
+
label: 'Created at',
|
|
24
|
+
cell: item => <CellText title={new Date(item.createdAt).toLocaleString()} />,
|
|
25
|
+
},
|
|
26
|
+
];
|
|
27
|
+
|
|
28
|
+
export const TodoList = ({ todos }: { todos: TodoItem[] }) => {
|
|
29
|
+
const { tableProps } = useTable({
|
|
30
|
+
mode: 'complete',
|
|
31
|
+
data: todos,
|
|
32
|
+
paginationOptions: { pageSize: todos.length || 1 },
|
|
33
|
+
});
|
|
34
|
+
|
|
35
|
+
return (
|
|
36
|
+
<Table
|
|
37
|
+
columnConfig={columns}
|
|
38
|
+
{...tableProps}
|
|
39
|
+
pagination={{ type: 'none' }}
|
|
40
|
+
/>
|
|
41
|
+
);
|
|
42
|
+
};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { screen } from '@testing-library/react';
|
|
2
|
+
import { rest } from 'msw';
|
|
3
|
+
import { setupServer } from 'msw/node';
|
|
4
|
+
import {
|
|
5
|
+
registerMswTestHooks,
|
|
6
|
+
renderInTestApp,
|
|
7
|
+
} from '@backstage/frontend-test-utils';
|
|
8
|
+
import { TodoPage } from './TodoPage';
|
|
9
|
+
|
|
10
|
+
describe('TodoPage', () => {
|
|
11
|
+
const server = setupServer();
|
|
12
|
+
registerMswTestHooks(server);
|
|
13
|
+
|
|
14
|
+
it('renders todos from the backend', async () => {
|
|
15
|
+
server.use(
|
|
16
|
+
rest.get('*/api/{{pluginId}}/todos', (_, res, ctx) =>
|
|
17
|
+
res(
|
|
18
|
+
ctx.json({
|
|
19
|
+
items: [
|
|
20
|
+
{ id: '1', title: 'Mocked task', createdBy: 'user:default/guest', createdAt: '2025-01-01T00:00:00.000Z' },
|
|
21
|
+
],
|
|
22
|
+
}),
|
|
23
|
+
),
|
|
24
|
+
),
|
|
25
|
+
);
|
|
26
|
+
|
|
27
|
+
await renderInTestApp(<TodoPage />);
|
|
28
|
+
|
|
29
|
+
expect(await screen.findByText('Mocked task')).toBeInTheDocument();
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
it('falls back to example data when the backend fails', async () => {
|
|
33
|
+
server.use(
|
|
34
|
+
rest.get('*/api/{{pluginId}}/todos', (_, res, ctx) =>
|
|
35
|
+
res(ctx.status(500), ctx.json({ message: 'Internal Server Error' })),
|
|
36
|
+
),
|
|
37
|
+
);
|
|
38
|
+
|
|
39
|
+
await renderInTestApp(<TodoPage />);
|
|
40
|
+
|
|
41
|
+
expect(await screen.findByText('Install the backend plugin')).toBeInTheDocument();
|
|
42
|
+
});
|
|
43
|
+
});
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { Progress } from '@backstage/core-components';
|
|
2
|
+
import {
|
|
3
|
+
useApi,
|
|
4
|
+
fetchApiRef,
|
|
5
|
+
} from '@backstage/frontend-plugin-api';
|
|
6
|
+
import { Header, Container } from '@backstage/ui';
|
|
7
|
+
import useAsync from 'react-use/esm/useAsync';
|
|
8
|
+
import { TodoList } from '../TodoList';
|
|
9
|
+
import type { TodoItem } from '../TodoList';
|
|
10
|
+
|
|
11
|
+
const exampleTodos: TodoItem[] = [
|
|
12
|
+
{ id: '1', title: 'Install the backend plugin', createdBy: 'user:default/guest', createdAt: new Date().toISOString() },
|
|
13
|
+
{ id: '2', title: 'Connect the frontend to real data', createdBy: 'user:default/guest', createdAt: new Date().toISOString() },
|
|
14
|
+
];
|
|
15
|
+
|
|
16
|
+
// TEMPLATE NOTE:
|
|
17
|
+
// This is a simple example of fetching data from the backend plugin.
|
|
18
|
+
// You can replace this with your own data fetching logic or use a
|
|
19
|
+
// generated client from an OpenAPI schema.
|
|
20
|
+
function useTodos() {
|
|
21
|
+
const { fetch } = useApi(fetchApiRef);
|
|
22
|
+
|
|
23
|
+
return useAsync(async (): Promise<TodoItem[]> => {
|
|
24
|
+
const response = await fetch(`plugin://{{pluginId}}/todos`);
|
|
25
|
+
|
|
26
|
+
if (!response.ok) {
|
|
27
|
+
throw new Error(
|
|
28
|
+
`Failed to fetch todos: ${response.status} ${response.statusText}`,
|
|
29
|
+
);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
const data = await response.json();
|
|
33
|
+
return data.items;
|
|
34
|
+
}, [fetch]);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
export const TodoPage = () => {
|
|
38
|
+
const { value: todos, loading, error } = useTodos();
|
|
39
|
+
|
|
40
|
+
if (loading) {
|
|
41
|
+
return <Progress />;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
return (
|
|
45
|
+
<>
|
|
46
|
+
<Header title="Welcome to {{pluginId}}!" />
|
|
47
|
+
<Container>
|
|
48
|
+
<TodoList todos={error ? exampleTodos : (todos ?? [])} />
|
|
49
|
+
</Container>
|
|
50
|
+
</>
|
|
51
|
+
);
|
|
52
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { TodoPage } from './TodoPage';
|
|
@@ -10,9 +10,9 @@ export const page = PageBlueprint.make({
|
|
|
10
10
|
path: '/{{pluginId}}',
|
|
11
11
|
routeRef: rootRouteRef,
|
|
12
12
|
loader: () =>
|
|
13
|
-
import('./components/
|
|
14
|
-
<m.
|
|
15
|
-
),
|
|
13
|
+
import('./components/TodoPage').then(m => (
|
|
14
|
+
<m.TodoPage />
|
|
15
|
+
)),
|
|
16
16
|
},
|
|
17
17
|
});
|
|
18
18
|
|
package/templates/frontend-plugin/src/components/ExampleComponent/ExampleComponent.test.tsx.hbs
DELETED
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { ExampleComponent } from './ExampleComponent';
|
|
2
|
-
import { rest } from 'msw';
|
|
3
|
-
import { setupServer } from 'msw/node';
|
|
4
|
-
import { screen } from '@testing-library/react';
|
|
5
|
-
import {
|
|
6
|
-
registerMswTestHooks,
|
|
7
|
-
renderInTestApp,
|
|
8
|
-
} from '@backstage/frontend-test-utils';
|
|
9
|
-
|
|
10
|
-
describe('ExampleComponent', () => {
|
|
11
|
-
const server = setupServer();
|
|
12
|
-
// Enable sane handlers for network requests
|
|
13
|
-
registerMswTestHooks(server);
|
|
14
|
-
|
|
15
|
-
// setup mock response
|
|
16
|
-
beforeEach(() => {
|
|
17
|
-
server.use(
|
|
18
|
-
rest.get('/*', (_, res, ctx) => res(ctx.status(200), ctx.json({}))),
|
|
19
|
-
);
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
it('should render', async () => {
|
|
23
|
-
await renderInTestApp(<ExampleComponent />);
|
|
24
|
-
expect(
|
|
25
|
-
screen.getByText('Welcome to {{pluginId}}!'),
|
|
26
|
-
).toBeInTheDocument();
|
|
27
|
-
});
|
|
28
|
-
});
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { Typography, Grid } from '@material-ui/core';
|
|
2
|
-
import {
|
|
3
|
-
InfoCard,
|
|
4
|
-
Header,
|
|
5
|
-
Page,
|
|
6
|
-
Content,
|
|
7
|
-
ContentHeader,
|
|
8
|
-
HeaderLabel,
|
|
9
|
-
SupportButton,
|
|
10
|
-
} from '@backstage/core-components';
|
|
11
|
-
import { ExampleFetchComponent } from '../ExampleFetchComponent';
|
|
12
|
-
|
|
13
|
-
export const ExampleComponent = () => (
|
|
14
|
-
<Page themeId="tool">
|
|
15
|
-
<Header title="Welcome to {{pluginId}}!" subtitle="Optional subtitle">
|
|
16
|
-
<HeaderLabel label="Owner" value="Team X" />
|
|
17
|
-
<HeaderLabel label="Lifecycle" value="Alpha" />
|
|
18
|
-
</Header>
|
|
19
|
-
<Content>
|
|
20
|
-
<ContentHeader title="Plugin title">
|
|
21
|
-
<SupportButton>A description of your plugin goes here.</SupportButton>
|
|
22
|
-
</ContentHeader>
|
|
23
|
-
<Grid container spacing={3} direction="column">
|
|
24
|
-
<Grid item>
|
|
25
|
-
<InfoCard title="Information card">
|
|
26
|
-
<Typography variant="body1">
|
|
27
|
-
All content should be wrapped in a card like this.
|
|
28
|
-
</Typography>
|
|
29
|
-
</InfoCard>
|
|
30
|
-
</Grid>
|
|
31
|
-
<Grid item>
|
|
32
|
-
<ExampleFetchComponent />
|
|
33
|
-
</Grid>
|
|
34
|
-
</Grid>
|
|
35
|
-
</Content>
|
|
36
|
-
</Page>
|
|
37
|
-
);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { ExampleComponent } from './ExampleComponent';
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { renderInTestApp } from '@backstage/frontend-test-utils';
|
|
2
|
-
import { ExampleFetchComponent } from './ExampleFetchComponent';
|
|
3
|
-
|
|
4
|
-
describe('ExampleFetchComponent', () => {
|
|
5
|
-
it('renders the user table', async () => {
|
|
6
|
-
const { getAllByText, getByAltText, getByText, findByRole } =
|
|
7
|
-
await renderInTestApp(<ExampleFetchComponent />);
|
|
8
|
-
|
|
9
|
-
// Wait for the table to render
|
|
10
|
-
const table = await findByRole('table');
|
|
11
|
-
const nationality = getAllByText('GB');
|
|
12
|
-
// Assert that the table contains the expected user data
|
|
13
|
-
expect(table).toBeInTheDocument();
|
|
14
|
-
expect(getByAltText('Carolyn')).toBeInTheDocument();
|
|
15
|
-
expect(getByText('Carolyn Moore')).toBeInTheDocument();
|
|
16
|
-
expect(getByText('carolyn.moore@example.com')).toBeInTheDocument();
|
|
17
|
-
expect(nationality[0]).toBeInTheDocument();
|
|
18
|
-
});
|
|
19
|
-
});
|
package/templates/frontend-plugin/src/components/ExampleFetchComponent/ExampleFetchComponent.tsx.hbs
DELETED
|
@@ -1,308 +0,0 @@
|
|
|
1
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
2
|
-
import {
|
|
3
|
-
Table,
|
|
4
|
-
TableColumn,
|
|
5
|
-
Progress,
|
|
6
|
-
ResponseErrorPanel,
|
|
7
|
-
} from '@backstage/core-components';
|
|
8
|
-
import useAsync from 'react-use/lib/useAsync';
|
|
9
|
-
|
|
10
|
-
export const exampleUsers = {
|
|
11
|
-
results: [
|
|
12
|
-
{
|
|
13
|
-
gender: 'female',
|
|
14
|
-
name: {
|
|
15
|
-
title: 'Miss',
|
|
16
|
-
first: 'Carolyn',
|
|
17
|
-
last: 'Moore',
|
|
18
|
-
},
|
|
19
|
-
email: 'carolyn.moore@example.com',
|
|
20
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Carolyn',
|
|
21
|
-
nat: 'GB',
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
gender: 'female',
|
|
25
|
-
name: {
|
|
26
|
-
title: 'Ms',
|
|
27
|
-
first: 'Esma',
|
|
28
|
-
last: 'Berberoğlu',
|
|
29
|
-
},
|
|
30
|
-
email: 'esma.berberoglu@example.com',
|
|
31
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Esma',
|
|
32
|
-
nat: 'TR',
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
gender: 'female',
|
|
36
|
-
name: {
|
|
37
|
-
title: 'Ms',
|
|
38
|
-
first: 'Isabella',
|
|
39
|
-
last: 'Rhodes',
|
|
40
|
-
},
|
|
41
|
-
email: 'isabella.rhodes@example.com',
|
|
42
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Isabella',
|
|
43
|
-
nat: 'GB',
|
|
44
|
-
},
|
|
45
|
-
{
|
|
46
|
-
gender: 'male',
|
|
47
|
-
name: {
|
|
48
|
-
title: 'Mr',
|
|
49
|
-
first: 'Derrick',
|
|
50
|
-
last: 'Carter',
|
|
51
|
-
},
|
|
52
|
-
email: 'derrick.carter@example.com',
|
|
53
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Derrick',
|
|
54
|
-
nat: 'IE',
|
|
55
|
-
},
|
|
56
|
-
{
|
|
57
|
-
gender: 'female',
|
|
58
|
-
name: {
|
|
59
|
-
title: 'Miss',
|
|
60
|
-
first: 'Mattie',
|
|
61
|
-
last: 'Lambert',
|
|
62
|
-
},
|
|
63
|
-
email: 'mattie.lambert@example.com',
|
|
64
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Mattie',
|
|
65
|
-
nat: 'AU',
|
|
66
|
-
},
|
|
67
|
-
{
|
|
68
|
-
gender: 'male',
|
|
69
|
-
name: {
|
|
70
|
-
title: 'Mr',
|
|
71
|
-
first: 'Mijat',
|
|
72
|
-
last: 'Rakić',
|
|
73
|
-
},
|
|
74
|
-
email: 'mijat.rakic@example.com',
|
|
75
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Mijat',
|
|
76
|
-
nat: 'RS',
|
|
77
|
-
},
|
|
78
|
-
{
|
|
79
|
-
gender: 'male',
|
|
80
|
-
name: {
|
|
81
|
-
title: 'Mr',
|
|
82
|
-
first: 'Javier',
|
|
83
|
-
last: 'Reid',
|
|
84
|
-
},
|
|
85
|
-
email: 'javier.reid@example.com',
|
|
86
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Javier',
|
|
87
|
-
nat: 'US',
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
gender: 'female',
|
|
91
|
-
name: {
|
|
92
|
-
title: 'Ms',
|
|
93
|
-
first: 'Isabella',
|
|
94
|
-
last: 'Li',
|
|
95
|
-
},
|
|
96
|
-
email: 'isabella.li@example.com',
|
|
97
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Isabella',
|
|
98
|
-
nat: 'CA',
|
|
99
|
-
},
|
|
100
|
-
{
|
|
101
|
-
gender: 'female',
|
|
102
|
-
name: {
|
|
103
|
-
title: 'Mrs',
|
|
104
|
-
first: 'Stephanie',
|
|
105
|
-
last: 'Garrett',
|
|
106
|
-
},
|
|
107
|
-
email: 'stephanie.garrett@example.com',
|
|
108
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Stephanie',
|
|
109
|
-
nat: 'AU',
|
|
110
|
-
},
|
|
111
|
-
{
|
|
112
|
-
gender: 'female',
|
|
113
|
-
name: {
|
|
114
|
-
title: 'Ms',
|
|
115
|
-
first: 'Antonia',
|
|
116
|
-
last: 'Núñez',
|
|
117
|
-
},
|
|
118
|
-
email: 'antonia.nunez@example.com',
|
|
119
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Antonia',
|
|
120
|
-
nat: 'ES',
|
|
121
|
-
},
|
|
122
|
-
{
|
|
123
|
-
gender: 'male',
|
|
124
|
-
name: {
|
|
125
|
-
title: 'Mr',
|
|
126
|
-
first: 'Donald',
|
|
127
|
-
last: 'Young',
|
|
128
|
-
},
|
|
129
|
-
email: 'donald.young@example.com',
|
|
130
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Donald',
|
|
131
|
-
nat: 'US',
|
|
132
|
-
},
|
|
133
|
-
{
|
|
134
|
-
gender: 'male',
|
|
135
|
-
name: {
|
|
136
|
-
title: 'Mr',
|
|
137
|
-
first: 'Iegor',
|
|
138
|
-
last: 'Holodovskiy',
|
|
139
|
-
},
|
|
140
|
-
email: 'iegor.holodovskiy@example.com',
|
|
141
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Iegor',
|
|
142
|
-
nat: 'UA',
|
|
143
|
-
},
|
|
144
|
-
{
|
|
145
|
-
gender: 'female',
|
|
146
|
-
name: {
|
|
147
|
-
title: 'Madame',
|
|
148
|
-
first: 'Jessica',
|
|
149
|
-
last: 'David',
|
|
150
|
-
},
|
|
151
|
-
email: 'jessica.david@example.com',
|
|
152
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Jessica',
|
|
153
|
-
nat: 'CH',
|
|
154
|
-
},
|
|
155
|
-
{
|
|
156
|
-
gender: 'female',
|
|
157
|
-
name: {
|
|
158
|
-
title: 'Ms',
|
|
159
|
-
first: 'Eve',
|
|
160
|
-
last: 'Martinez',
|
|
161
|
-
},
|
|
162
|
-
email: 'eve.martinez@example.com',
|
|
163
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Eve',
|
|
164
|
-
nat: 'FR',
|
|
165
|
-
},
|
|
166
|
-
{
|
|
167
|
-
gender: 'male',
|
|
168
|
-
name: {
|
|
169
|
-
title: 'Mr',
|
|
170
|
-
first: 'Caleb',
|
|
171
|
-
last: 'Silva',
|
|
172
|
-
},
|
|
173
|
-
email: 'caleb.silva@example.com',
|
|
174
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Caleb',
|
|
175
|
-
nat: 'US',
|
|
176
|
-
},
|
|
177
|
-
{
|
|
178
|
-
gender: 'female',
|
|
179
|
-
name: {
|
|
180
|
-
title: 'Miss',
|
|
181
|
-
first: 'Marcia',
|
|
182
|
-
last: 'Jenkins',
|
|
183
|
-
},
|
|
184
|
-
email: 'marcia.jenkins@example.com',
|
|
185
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Marcia',
|
|
186
|
-
nat: 'US',
|
|
187
|
-
},
|
|
188
|
-
{
|
|
189
|
-
gender: 'female',
|
|
190
|
-
name: {
|
|
191
|
-
title: 'Mrs',
|
|
192
|
-
first: 'Mackenzie',
|
|
193
|
-
last: 'Jones',
|
|
194
|
-
},
|
|
195
|
-
email: 'mackenzie.jones@example.com',
|
|
196
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Mackenzie',
|
|
197
|
-
nat: 'NZ',
|
|
198
|
-
},
|
|
199
|
-
{
|
|
200
|
-
gender: 'male',
|
|
201
|
-
name: {
|
|
202
|
-
title: 'Mr',
|
|
203
|
-
first: 'Jeremiah',
|
|
204
|
-
last: 'Gutierrez',
|
|
205
|
-
},
|
|
206
|
-
email: 'jeremiah.gutierrez@example.com',
|
|
207
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Jeremiah',
|
|
208
|
-
nat: 'AU',
|
|
209
|
-
},
|
|
210
|
-
{
|
|
211
|
-
gender: 'female',
|
|
212
|
-
name: {
|
|
213
|
-
title: 'Ms',
|
|
214
|
-
first: 'Luciara',
|
|
215
|
-
last: 'Souza',
|
|
216
|
-
},
|
|
217
|
-
email: 'luciara.souza@example.com',
|
|
218
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Luciara',
|
|
219
|
-
nat: 'BR',
|
|
220
|
-
},
|
|
221
|
-
{
|
|
222
|
-
gender: 'male',
|
|
223
|
-
name: {
|
|
224
|
-
title: 'Mr',
|
|
225
|
-
first: 'Valgi',
|
|
226
|
-
last: 'da Cunha',
|
|
227
|
-
},
|
|
228
|
-
email: 'valgi.dacunha@example.com',
|
|
229
|
-
picture: 'https://api.dicebear.com/6.x/open-peeps/svg?seed=Valgi',
|
|
230
|
-
nat: 'BR',
|
|
231
|
-
},
|
|
232
|
-
],
|
|
233
|
-
};
|
|
234
|
-
|
|
235
|
-
const useStyles = makeStyles({
|
|
236
|
-
avatar: {
|
|
237
|
-
height: 32,
|
|
238
|
-
width: 32,
|
|
239
|
-
borderRadius: '50%',
|
|
240
|
-
},
|
|
241
|
-
});
|
|
242
|
-
|
|
243
|
-
type User = {
|
|
244
|
-
gender: string; // "male"
|
|
245
|
-
name: {
|
|
246
|
-
title: string; // "Mr",
|
|
247
|
-
first: string; // "Duane",
|
|
248
|
-
last: string; // "Reed"
|
|
249
|
-
};
|
|
250
|
-
email: string; // "duane.reed@example.com"
|
|
251
|
-
picture: string; // "https://api.dicebear.com/6.x/open-peeps/svg?seed=Duane"
|
|
252
|
-
nat: string; // "AU"
|
|
253
|
-
};
|
|
254
|
-
|
|
255
|
-
type DenseTableProps = {
|
|
256
|
-
users: User[];
|
|
257
|
-
};
|
|
258
|
-
|
|
259
|
-
export const DenseTable = ({ users }: DenseTableProps) => {
|
|
260
|
-
const classes = useStyles();
|
|
261
|
-
|
|
262
|
-
const columns: TableColumn[] = [
|
|
263
|
-
{ title: 'Avatar', field: 'avatar' },
|
|
264
|
-
{ title: 'Name', field: 'name' },
|
|
265
|
-
{ title: 'Email', field: 'email' },
|
|
266
|
-
{ title: 'Nationality', field: 'nationality' },
|
|
267
|
-
];
|
|
268
|
-
|
|
269
|
-
const data = users.map(user => {
|
|
270
|
-
return {
|
|
271
|
-
avatar: (
|
|
272
|
-
<img
|
|
273
|
-
src={user.picture}
|
|
274
|
-
className={classes.avatar}
|
|
275
|
-
alt={user.name.first}
|
|
276
|
-
/>
|
|
277
|
-
),
|
|
278
|
-
name: `${user.name.first} ${user.name.last}`,
|
|
279
|
-
email: user.email,
|
|
280
|
-
nationality: user.nat,
|
|
281
|
-
};
|
|
282
|
-
});
|
|
283
|
-
|
|
284
|
-
return (
|
|
285
|
-
<Table
|
|
286
|
-
title="Example User List"
|
|
287
|
-
options=\{{ search: false, paging: false }}
|
|
288
|
-
columns={columns}
|
|
289
|
-
data={data}
|
|
290
|
-
/>
|
|
291
|
-
);
|
|
292
|
-
};
|
|
293
|
-
|
|
294
|
-
export const ExampleFetchComponent = () => {
|
|
295
|
-
|
|
296
|
-
const { value, loading, error } = useAsync(async (): Promise<User[]> => {
|
|
297
|
-
// Would use fetch in a real world example
|
|
298
|
-
return exampleUsers.results;
|
|
299
|
-
}, []);
|
|
300
|
-
|
|
301
|
-
if (loading) {
|
|
302
|
-
return <Progress />;
|
|
303
|
-
} else if (error) {
|
|
304
|
-
return <ResponseErrorPanel error={error} />;
|
|
305
|
-
}
|
|
306
|
-
|
|
307
|
-
return <DenseTable users={value || []} />;
|
|
308
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { ExampleFetchComponent } from './ExampleFetchComponent';
|