diff --git a/package-lock.json b/package-lock.json index ce9e4bd90..99e72207c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -72,7 +72,7 @@ "typesafe-actions": "^5.1.0", "typescript": "^4.8.2", "vite": "^5.0.10", - "vite-plugin-checker": "^0.5.0", + "vite-plugin-checker": "^0.8.0", "vite-plugin-node": "^3.1.0", "vite-plugin-svgr": "^4.2.0" }, @@ -9800,6 +9800,20 @@ "node": ">= 0.6" } }, + "node_modules/fs-extra": { + "version": "11.2.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz", + "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==", + "license": "MIT", + "dependencies": { + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + }, + "engines": { + "node": ">=14.14" + } + }, "node_modules/fs-monkey": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.5.tgz", @@ -12801,11 +12815,6 @@ "devOptional": true, "peer": true }, - "node_modules/lodash.pick": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz", - "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==" - }, "node_modules/log-update": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/log-update/-/log-update-5.0.1.tgz", @@ -16937,9 +16946,10 @@ } }, "node_modules/vite-plugin-checker": { - "version": "0.5.6", - "resolved": "https://registry.npmjs.org/vite-plugin-checker/-/vite-plugin-checker-0.5.6.tgz", - "integrity": "sha512-ftRyON0gORUHDxcDt2BErmsikKSkfvl1i2DoP6Jt2zDO9InfvM6tqO1RkXhSjkaXEhKPea6YOnhFaZxW3BzudQ==", + "version": "0.8.0", + "resolved": "https://registry.npmjs.org/vite-plugin-checker/-/vite-plugin-checker-0.8.0.tgz", + "integrity": "sha512-UA5uzOGm97UvZRTdZHiQVYFnd86AVn8EVaD4L3PoVzxH+IZSfaAw14WGFwX9QS23UW3lV/5bVKZn6l0w+q9P0g==", + "license": "MIT", "dependencies": { "@babel/code-frame": "^7.12.13", "ansi-escapes": "^4.3.0", @@ -16948,8 +16958,6 @@ "commander": "^8.0.0", "fast-glob": "^3.2.7", "fs-extra": "^11.1.0", - "lodash.debounce": "^4.0.8", - "lodash.pick": "^4.4.0", "npm-run-path": "^4.0.1", "strip-ansi": "^6.0.0", "tiny-invariant": "^1.1.0", @@ -16962,6 +16970,7 @@ "node": ">=14.16" }, "peerDependencies": { + "@biomejs/biome": ">=1.7", "eslint": ">=7", "meow": "^9.0.0", "optionator": "^0.9.1", @@ -16970,9 +16979,12 @@ "vite": ">=2.0.0", "vls": "*", "vti": "*", - "vue-tsc": "*" + "vue-tsc": "~2.1.6" }, "peerDependenciesMeta": { + "@biomejs/biome": { + "optional": true + }, "eslint": { "optional": true }, @@ -17003,6 +17015,7 @@ "version": "4.3.2", "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz", "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==", + "license": "MIT", "dependencies": { "type-fest": "^0.21.3" }, @@ -17017,27 +17030,16 @@ "version": "8.3.0", "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", + "license": "MIT", "engines": { "node": ">= 12" } }, - "node_modules/vite-plugin-checker/node_modules/fs-extra": { - "version": "11.2.0", - "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz", - "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==", - "dependencies": { - "graceful-fs": "^4.2.0", - "jsonfile": "^6.0.1", - "universalify": "^2.0.0" - }, - "engines": { - "node": ">=14.14" - } - }, "node_modules/vite-plugin-checker/node_modules/npm-run-path": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz", "integrity": "sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==", + "license": "MIT", "dependencies": { "path-key": "^3.0.0" }, @@ -17049,6 +17051,7 @@ "version": "0.21.3", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz", "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==", + "license": "(MIT OR CC0-1.0)", "engines": { "node": ">=10" }, diff --git a/package.json b/package.json index d1352e2ac..849144996 100644 --- a/package.json +++ b/package.json @@ -70,7 +70,7 @@ "typesafe-actions": "^5.1.0", "typescript": "^4.8.2", "vite": "^5.0.10", - "vite-plugin-checker": "^0.5.0", + "vite-plugin-checker": "^0.8.0", "vite-plugin-node": "^3.1.0", "vite-plugin-svgr": "^4.2.0" }, diff --git a/src/components/Extensions/Details/DetailCard/Tabs/ParamList.test.tsx b/src/components/Extensions/Details/DetailCard/Tabs/ParamList.test.tsx index d098b6625..3c1493702 100644 --- a/src/components/Extensions/Details/DetailCard/Tabs/ParamList.test.tsx +++ b/src/components/Extensions/Details/DetailCard/Tabs/ParamList.test.tsx @@ -27,7 +27,7 @@ describe('ParamList', () => { const PARAM = 'pirojok-the-param'; const LABEL = 'pirojok-the-label'; const VALUE = 'pirojok-the-value'; - const extension: Extension = { + const staticExtension: Extension = { id, params: [ { @@ -39,6 +39,28 @@ describe('ParamList', () => { ], } as Extension; + const dynId = 'dyn-pirojok'; + const DYN_DESCRIPTION = 'dyn-pirojok-the-description'; + const DYN_PARAM = 'dyn-pirojok-the-param'; + const DYN_LABEL = 'dyn-pirojok-the-label'; + const DYN_VALUE = 'dyn-pirojok-the-value'; + const LABELS: Record = { + createdBy: 'SDK', + codebase: 'default', + }; + const dynamicExtension: Extension = { + id: dynId, + params: [ + { + param: DYN_PARAM, + label: DYN_LABEL, + value: DYN_VALUE, + description: DYN_DESCRIPTION, + }, + ], + labels: LABELS, + } as Extension; + function setup(extension: Extension, id: string) { return render( @@ -47,15 +69,22 @@ describe('ParamList', () => { ); } - it('renders list of parameters', () => { - const { getByText } = setup(extension, id); + it('renders list of parameters for static extensions', () => { + const { getByText } = setup(staticExtension, id); expect(getByText(new RegExp(LABEL))).not.toBeNull(); expect(getByText(new RegExp(VALUE))).not.toBeNull(); }); - it('displays param description on expansion in markdown', () => { - const { getByText } = setup(extension, id); + it('renders list of parameters for dynamic extensions', () => { + const { getByText } = setup(dynamicExtension, dynId); + + expect(getByText(new RegExp(DYN_LABEL))).not.toBeNull(); + expect(getByText(new RegExp(DYN_VALUE))).not.toBeNull(); + }); + + it('displays param description on expansion in markdown for static', () => { + const { getByText } = setup(staticExtension, id); act(() => { getByText(new RegExp(LABEL)).click(); @@ -63,4 +92,13 @@ describe('ParamList', () => { expect(getByText(new RegExp(DESCRIPTION))).not.toBeNull(); expect(getByText(new RegExp(DESCRIPTION))).not.toBeNull(); }); + + it('displays param description on expansion in markdown for dynamic', () => { + const { getByText } = setup(dynamicExtension, dynId); + + act(() => { + getByText(new RegExp(DYN_LABEL)).click(); + }); + expect(getByText(new RegExp(DYN_DESCRIPTION))).not.toBeNull(); + }); }); diff --git a/src/components/Extensions/Details/DetailCard/Tabs/ParamList.tsx b/src/components/Extensions/Details/DetailCard/Tabs/ParamList.tsx index 7b059683c..acc1732ec 100644 --- a/src/components/Extensions/Details/DetailCard/Tabs/ParamList.tsx +++ b/src/components/Extensions/Details/DetailCard/Tabs/ParamList.tsx @@ -21,36 +21,51 @@ import { Callout } from '../../../../common/Callout'; import { DOCS_BASE } from '../../../../common/links/DocsLink'; import { Markdown } from '../../../../common/Markdown'; import { useExtension } from '../../../api/useExtension'; +import { isDynamicExtension } from '../../../api/useExtensions'; import { EventsConfig } from './EventsConfig'; import styles from './ParamList.module.scss'; import { ParamValue } from './ParamValue'; function ParamList() { const extension = useExtension()!; + const isDynamic = isDynamicExtension(extension); + const docSuffix = isDynamic + ? 'extensions/manage-installed-extensions?interface=sdk#reconfigure' + : 'extensions/manifest'; + + const dynamicFragment = ( + + Reconfigure is not available in the emulator. You can reconfigure + parameters by updating them in the code. + + ); + + const staticFragment = ( + <> + + Reconfigure is not available in the emulator. You can reconfigure + parameters by updating your .env files with: + +
+ firebase ext:configure {extension.id} --local) + + ); + return (
- - Reconfigure is not available in the emulator. You can - reconfigure parameters by updating your .env files with: - - } - > - firebase ext:configure {extension.id} --local - - + {isDynamic ? dynamicFragment : staticFragment} +
{(extension.params || []).map((param) => { diff --git a/src/components/Extensions/List/ExtensionsCallout.tsx b/src/components/Extensions/List/ExtensionsCallout.tsx index 5f98ab730..2b32b3e0b 100644 --- a/src/components/Extensions/List/ExtensionsCallout.tsx +++ b/src/components/Extensions/List/ExtensionsCallout.tsx @@ -30,12 +30,12 @@ export const ExtensionCallout: React.FC< actions={
- Learn how to manage your extensions manifest + Learn how to manage your extensions
diff --git a/src/components/Extensions/List/ExtensionsTable/ExtensionTableRow.tsx b/src/components/Extensions/List/ExtensionsTable/ExtensionTableRow.tsx index 77d364d50..ebe72a2a0 100644 --- a/src/components/Extensions/List/ExtensionsTable/ExtensionTableRow.tsx +++ b/src/components/Extensions/List/ExtensionsTable/ExtensionTableRow.tsx @@ -65,6 +65,11 @@ export const ExtensionsTableRow: React.FC< {extension.ref}
+
+ + {extension.id} + +