From 3749c01b4f78b7d06f80b1bc544e5daeab4963ed Mon Sep 17 00:00:00 2001 From: Alex Tkachev Date: Wed, 3 Jul 2024 14:46:03 +0400 Subject: [PATCH 1/6] chore: upgrade turborepo to 2.0 --- apps/cms/package.json | 3 +- apps/cms/turbo.json | 4 +- apps/decap/turbo.json | 2 +- apps/preview/turbo.json | 2 +- apps/website/turbo.json | 2 +- package.json | 13 ++-- packages/drupal/gutenberg_blocks/turbo.json | 2 +- packages/schema/turbo.json | 2 +- packages/ui/turbo.json | 2 +- pnpm-lock.yaml | 72 ++++++++++----------- tests/e2e/turbo.json | 2 +- tests/schema/turbo.json | 2 +- turbo.json | 2 +- 13 files changed, 55 insertions(+), 55 deletions(-) diff --git a/apps/cms/package.json b/apps/cms/package.json index d0a43c47a..db511f111 100644 --- a/apps/cms/package.json +++ b/apps/cms/package.json @@ -11,10 +11,9 @@ "prep:database": "./prep-database.sh", "prep:schema": "pnpm drush silverback-gatsby:schema-export ../../../tests/schema || true", "fix-premissions": "chmod +w web/sites/default/files/.htaccess && chmod +w web/sites/default/files/private/.htaccess", - "ensure-working-db": "pnpm drush sqlq 'select * from node'", "drush": "SB_ENVIRONMENT=1 SIMPLETEST_DB=sqlite://localhost/sites/default/files/.sqlite DRUSH_OPTIONS_URI=http://127.0.0.1:8888 vendor/bin/drush", "silverback": "SB_ENVIRONMENT=1 SIMPLETEST_DB=sqlite://localhost/sites/default/files/.sqlite SB_ADMIN_USER=admin SB_ADMIN_PASS=admin vendor/bin/silverback", - "drupal-install": "SB_SETUP=1 pnpm silverback setup --profile minimal && pnpm content:import && pnpm drush php-eval 'node_access_rebuild();' && rm -rf install-cache.zip && pnpm fix-premissions && pnpm ensure-working-db", + "drupal-install": "SB_SETUP=1 pnpm silverback setup --profile minimal && pnpm content:import && pnpm drush php-eval 'node_access_rebuild();' && rm -rf install-cache.zip && pnpm fix-premissions", "export-webforms": "pnpm turbo --filter '@custom-tests/e2e' webform-snapshots", "start": "cd web; SB_ENVIRONMENT=1 SIMPLETEST_DB=sqlite://localhost/sites/default/files/.sqlite DRUSH_OPTIONS_URI=http://127.0.0.1:8888 php -S 0.0.0.0:8888 .ht.router.php # no drush to avoid the drush server timeout", "dev": "pnpm start", diff --git a/apps/cms/turbo.json b/apps/cms/turbo.json index 36ad2b625..6071bc9b6 100644 --- a/apps/cms/turbo.json +++ b/apps/cms/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "prep": { "dependsOn": ["prep:schema"] }, @@ -27,7 +27,7 @@ "outputs": [ "drush/**", "vendor/**", - "!**/.git/**", + "!*/**/.git/**", "web/**", "!web/modules/custom/**", "!web/themes/custom/**", diff --git a/apps/decap/turbo.json b/apps/decap/turbo.json index 84897ed6e..b6cfb94b3 100644 --- a/apps/decap/turbo.json +++ b/apps/decap/turbo.json @@ -1,7 +1,7 @@ { "$schema": "https://turborepo.org/schema.json", "extends": ["//"], - "pipeline": { + "tasks": { "prep:vite": { "dependsOn": ["^prep"], "inputs": ["src/**", "vite.config.ts", "index.html"], diff --git a/apps/preview/turbo.json b/apps/preview/turbo.json index 1b2fdd568..4fd41579b 100644 --- a/apps/preview/turbo.json +++ b/apps/preview/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "prep": { "dependsOn": ["prep:app", "prep:server"] }, diff --git a/apps/website/turbo.json b/apps/website/turbo.json index fb8be6347..7b3520047 100644 --- a/apps/website/turbo.json +++ b/apps/website/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "dev": { "persistent": true, "dependsOn": ["prep", "^prep"] diff --git a/package.json b/package.json index c86941856..17b02c490 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "node": "^18.19.0", "pnpm": "8.6.12" }, + "packageManager": "pnpm@8.6.12", "scripts": { "postinstall": "husky install || true", "commit": "git-cz", @@ -16,11 +17,11 @@ "test:format:root": "pnpm prettier --ignore-unknown '**/**'", "test:format:workspaces": "pnpm --workspace-concurrency=1 -r exec prettier --ignore-unknown '**/**'", "turbo:local": "if [ -z $CI ]; then echo $(date)$RANDOM > apps/cms/turbo-seed.txt; fi", - "turbo:test": "pnpm turbo:local && pnpm tb test:unit --no-daemon --go-fallback --output-logs=new-only && pnpm tb test:integration --no-daemon --go-fallback --output-logs=new-only --concurrency=1", - "turbo:test:force": "pnpm tb test:unit --no-daemon --go-fallback --output-logs=new-only --force && pnpm tb test:integration --no-daemon --go-fallback --output-logs=new-only --concurrency=1 --force", - "turbo:test:quick": "pnpm turbo:local && pnpm tb test:unit --no-daemon --go-fallback --output-logs=new-only", - "turbo:prep": "pnpm turbo:local && pnpm tb prep --no-daemon --go-fallback --output-logs=new-only", - "turbo:prep:force": "rm -f apps/cms/web/sites/default/files/.sqlite && pnpm tb prep --no-daemon --go-fallback --force", + "turbo:test": "pnpm turbo:local && pnpm turbo test:unit --output-logs=new-only && pnpm turbo test:integration --output-logs=new-only --concurrency=1", + "turbo:test:force": "pnpm turbo test:unit --output-logs=new-only --force && pnpm turbo test:integration --output-logs=new-only --concurrency=1 --force", + "turbo:test:quick": "pnpm turbo:local && pnpm turbo test:unit --output-logs=new-only", + "turbo:prep": "pnpm turbo:local && pnpm turbo prep --output-logs=new-only", + "turbo:prep:force": "rm -f apps/cms/web/sites/default/files/.sqlite && pnpm turbo prep --force", "gutenberg:generate": "pnpm run --filter \"@custom/gutenberg_blocks\" gutenberg:generate" }, "private": true, @@ -39,7 +40,7 @@ "eslint-plugin-simple-import-sort": "^10.0.0", "husky": "^8.0.3", "prettier": "^3.2.5", - "turbo": "^1.11.2", + "turbo": "^2.0.6", "typescript": "^5.3.3", "vitest": "^1.1.1" }, diff --git a/packages/drupal/gutenberg_blocks/turbo.json b/packages/drupal/gutenberg_blocks/turbo.json index 60256ce21..bedaee983 100644 --- a/packages/drupal/gutenberg_blocks/turbo.json +++ b/packages/drupal/gutenberg_blocks/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "test:static": { "inputs": ["src/**"] }, diff --git a/packages/schema/turbo.json b/packages/schema/turbo.json index 85d8a583f..006026389 100644 --- a/packages/schema/turbo.json +++ b/packages/schema/turbo.json @@ -1,7 +1,7 @@ { "$schema": "https://turborepo.org/schema.json", "extends": ["//"], - "pipeline": { + "tasks": { "prep:directives": { "dependsOn": ["@custom/cms#prep:composer"], "inputs": ["package.json"], diff --git a/packages/ui/turbo.json b/packages/ui/turbo.json index 52b8064c4..685bbca6d 100644 --- a/packages/ui/turbo.json +++ b/packages/ui/turbo.json @@ -1,7 +1,7 @@ { "$schema": "https://turborepo.org/schema.json", "extends": ["//"], - "pipeline": { + "tasks": { "prep:fonts": { "inputs": ["static/public/fonts/preload/**"], "outputs": ["build/preloaded-fonts.json"] diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7c01c9c7d..abc399cd4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -57,8 +57,8 @@ importers: specifier: ^3.2.5 version: 3.2.5 turbo: - specifier: ^1.11.2 - version: 1.11.2 + specifier: ^2.0.6 + version: 2.0.6 typescript: specifier: ^5.3.3 version: 5.3.3 @@ -565,7 +565,7 @@ importers: devDependencies: '@amazeelabs/bridge-storybook': specifier: ^1.2.8 - version: 1.2.8(@storybook/addon-actions@8.1.6)(happy-dom@12.10.3)(playwright@1.43.0)(react@18.2.0) + version: 1.2.8(@storybook/addon-actions@8.1.6)(happy-dom@12.10.3)(playwright@1.44.1)(react@18.2.0) '@amazeelabs/cloudinary-responsive-image': specifier: ^1.6.15 version: 1.6.15 @@ -640,7 +640,7 @@ importers: version: 10.4.16(postcss@8.4.32) axe-playwright: specifier: ^2.0.1 - version: 2.0.1(playwright@1.43.0) + version: 2.0.1(playwright@1.44.1) cssnano: specifier: ^6.0.3 version: 6.0.3(postcss@8.4.32) @@ -782,7 +782,7 @@ packages: - webdriverio dev: false - /@amazeelabs/bridge-storybook@1.2.8(@storybook/addon-actions@8.1.6)(happy-dom@12.10.3)(playwright@1.43.0)(react@18.2.0): + /@amazeelabs/bridge-storybook@1.2.8(@storybook/addon-actions@8.1.6)(happy-dom@12.10.3)(playwright@1.44.1)(react@18.2.0): resolution: {integrity: sha512-cM0IS1pZayNDPIc//8qKglo09RgTC0gCqCRKP5i3AuFAKZiLNZxGOWwwhS4aB2q81nBnzrAVj22rnyaaqEUpdw==} peerDependencies: '@storybook/addon-actions': '>=7.6.7' @@ -793,7 +793,7 @@ packages: optionalDependencies: '@types/react': 18.2.46 typescript: 5.4.4 - vitest: 0.34.6(happy-dom@12.10.3)(playwright@1.43.0) + vitest: 0.34.6(happy-dom@12.10.3)(playwright@1.44.1) transitivePeerDependencies: - '@edge-runtime/vm' - '@vitest/browser' @@ -7109,8 +7109,8 @@ packages: /@radix-ui/react-compose-refs@1.1.0(@types/react@18.2.46)(react@18.2.0): resolution: {integrity: sha512-b4inOtiaOnYf9KWyO3jAeeCG6FeyfY6ldiEPanbUjWd+xIk5wZeHa8yVwmrJ2vderhu/BQvzCrJI0lHd+wIiqw==} peerDependencies: - '@types/react': 18.3.3 - react: 19.0.0-rc.0 + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc peerDependenciesMeta: '@types/react': optional: true @@ -7332,8 +7332,8 @@ packages: /@radix-ui/react-use-callback-ref@1.1.0(@types/react@18.2.46)(react@18.2.0): resolution: {integrity: sha512-CasTfvsy+frcFkbXtSJ2Zu9JHpN8TYKxkgJGWbjiZhFivxaeW7rMeZt7QELGVLaYVfFMsKHjb7Ak0nMEe+2Vfw==} peerDependencies: - '@types/react': 18.3.3 - react: 19.0.0-rc.0 + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc peerDependenciesMeta: '@types/react': optional: true @@ -7373,8 +7373,8 @@ packages: /@radix-ui/react-use-layout-effect@1.1.0(@types/react@18.2.46)(react@18.2.0): resolution: {integrity: sha512-+FPE0rOdziWSrH9athwI1R0HDVbWlEhd+FR+aSDk4uWGmSJ9Z54sdZVDQPZAinJhJXwfT+qnj969mCsT2gfm5w==} peerDependencies: - '@types/react': 18.3.3 - react: 19.0.0-rc.0 + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc peerDependenciesMeta: '@types/react': optional: true @@ -12467,7 +12467,7 @@ packages: rimraf: 3.0.2 dev: true - /axe-playwright@2.0.1(playwright@1.43.0): + /axe-playwright@2.0.1(playwright@1.44.1): resolution: {integrity: sha512-MHjNjGARulF9XzqSfspmNjw+tpBz4x9o1VlTuLWEUW9fqzhn+xWa1qEpuOIQPbsRWQiLfooDjQAunLeE0PM5AQ==} peerDependencies: playwright: '>1.0.0' @@ -12477,7 +12477,7 @@ packages: axe-html-reporter: 2.2.3(axe-core@4.7.0) junit-report-builder: 3.2.1 picocolors: 1.0.0 - playwright: 1.43.0 + playwright: 1.44.1 dev: true /axios@0.21.4(debug@4.3.4): @@ -31369,64 +31369,64 @@ packages: resolution: {integrity: sha512-gHbdMZlA6Ym6Ur5pSH/UWrNQMIM9IqTH6SoL1DbHpqEdQ8i+cFunSmSlFykPt0eGQwZ4d/XTHOl74H0/kFBVWw==} dev: true - /turbo-darwin-64@1.11.2: - resolution: {integrity: sha512-toFmRG/adriZY3hOps7nYCfqHAS+Ci6xqgX3fbo82kkLpC6OBzcXnleSwuPqjHVAaRNhVoB83L5njcE9Qwi2og==} + /turbo-darwin-64@2.0.6: + resolution: {integrity: sha512-XpgBwWj3Ggmz/gQVqXdMKXHC1iFPMDiuwugLwSzE7Ih0O13JuNtYZKhQnopvbDQnFQCeRq2Vsm5OTWabg/oB/g==} cpu: [x64] os: [darwin] requiresBuild: true dev: true optional: true - /turbo-darwin-arm64@1.11.2: - resolution: {integrity: sha512-FCsEDZ8BUSFYEOSC3rrARQrj7x2VOrmVcfrMUIhexTxproRh4QyMxLfr6LALk4ymx6jbDCxWa6Szal8ckldFbA==} + /turbo-darwin-arm64@2.0.6: + resolution: {integrity: sha512-RfeZYXIAkiA21E8lsvfptGTqz/256YD+eI1x37fedfvnHFWuIMFZGAOwJxtZc6QasQunDZ9TRRREbJNI68tkIw==} cpu: [arm64] os: [darwin] requiresBuild: true dev: true optional: true - /turbo-linux-64@1.11.2: - resolution: {integrity: sha512-Vzda/o/QyEske5CxLf0wcu7UUS+7zB90GgHZV4tyN+WZtoouTvbwuvZ3V6b5Wgd3OJ/JwWR0CXDK7Sf4VEMr7A==} + /turbo-linux-64@2.0.6: + resolution: {integrity: sha512-92UDa0xNQQbx0HdSp9ag3YSS3xPdavhc7q9q9mxIAcqyjjD6VElA4Y85m4F/DDGE5SolCrvBz2sQhVmkOd6Caw==} cpu: [x64] os: [linux] requiresBuild: true dev: true optional: true - /turbo-linux-arm64@1.11.2: - resolution: {integrity: sha512-bRLwovQRz0yxDZrM4tQEAYV0fBHEaTzUF0JZ8RG1UmZt/CqtpnUrJpYb1VK8hj1z46z9YehARpYCwQ2K0qU4yw==} + /turbo-linux-arm64@2.0.6: + resolution: {integrity: sha512-eQKu6utCVUkIH2kqOzD8OS6E0ba6COjWm6PRDTNCHQRljZW503ycaTUIdMOiJrVg1MkEjDyOReUg8s8D18aJ4Q==} cpu: [arm64] os: [linux] requiresBuild: true dev: true optional: true - /turbo-windows-64@1.11.2: - resolution: {integrity: sha512-LgTWqkHAKgyVuLYcEPxZVGPInTjjeCnN5KQMdJ4uQZ+xMDROvMFS2rM93iQl4ieDJgidwHCxxCxaU9u8c3d/Kg==} + /turbo-windows-64@2.0.6: + resolution: {integrity: sha512-+9u4EPrpoeHYCQ46dRcou9kbkSoelhOelHNcbs2d86D6ruYD/oIAHK9qgYK8LeARRz0jxhZIA/dWYdYsxJJWkw==} cpu: [x64] os: [win32] requiresBuild: true dev: true optional: true - /turbo-windows-arm64@1.11.2: - resolution: {integrity: sha512-829aVBU7IX0c/B4G7g1VI8KniAGutHhIupkYMgF6xPkYVev2G3MYe6DMS/vsLt9GGM9ulDtdWxWrH5P2ngK8IQ==} + /turbo-windows-arm64@2.0.6: + resolution: {integrity: sha512-rdrKL+p+EjtdDVg0wQ/7yTbzkIYrnb0Pw4IKcjsy3M0RqUM9UcEi67b94XOAyTa5a0GqJL1+tUj2ebsFGPgZbg==} cpu: [arm64] os: [win32] requiresBuild: true dev: true optional: true - /turbo@1.11.2: - resolution: {integrity: sha512-jPC7LVQJzebs5gWf8FmEvsvXGNyKbN+O9qpvv98xpNaM59aS0/Irhd0H0KbcqnXfsz7ETlzOC3R+xFWthC4Z8A==} + /turbo@2.0.6: + resolution: {integrity: sha512-/Ftmxd5Mq//a9yMonvmwENNUN65jOVTwhhBPQjEtNZutYT9YKyzydFGLyVM1nzhpLWahQSMamRc/RDBv5EapzA==} hasBin: true optionalDependencies: - turbo-darwin-64: 1.11.2 - turbo-darwin-arm64: 1.11.2 - turbo-linux-64: 1.11.2 - turbo-linux-arm64: 1.11.2 - turbo-windows-64: 1.11.2 - turbo-windows-arm64: 1.11.2 + turbo-darwin-64: 2.0.6 + turbo-darwin-arm64: 2.0.6 + turbo-linux-64: 2.0.6 + turbo-linux-arm64: 2.0.6 + turbo-windows-64: 2.0.6 + turbo-windows-arm64: 2.0.6 dev: true /type-check@0.4.0: @@ -32750,7 +32750,7 @@ packages: dev: false optional: true - /vitest@0.34.6(happy-dom@12.10.3)(playwright@1.43.0): + /vitest@0.34.6(happy-dom@12.10.3)(playwright@1.44.1): resolution: {integrity: sha512-+5CALsOvbNKnS+ZHMXtuUC7nL8/7F1F2DnHGjSsszX8zCjWSSviphCb/NuS9Nzf4Q03KyyDRBAXhF/8lffME4Q==} engines: {node: '>=v14.18.0'} hasBin: true @@ -32800,7 +32800,7 @@ packages: magic-string: 0.30.9 pathe: 1.1.2 picocolors: 1.0.0 - playwright: 1.43.0 + playwright: 1.44.1 std-env: 3.7.0 strip-literal: 1.3.0 tinybench: 2.6.0 diff --git a/tests/e2e/turbo.json b/tests/e2e/turbo.json index c627c0a30..4d7d4e02a 100644 --- a/tests/e2e/turbo.json +++ b/tests/e2e/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "prep": { "cache": false }, diff --git a/tests/schema/turbo.json b/tests/schema/turbo.json index 220d284ec..a9346c887 100644 --- a/tests/schema/turbo.json +++ b/tests/schema/turbo.json @@ -1,6 +1,6 @@ { "extends": ["//"], - "pipeline": { + "tasks": { "test:integration": { "dependsOn": ["@custom/cms#prep"] }, diff --git a/turbo.json b/turbo.json index 9699cbe58..a70450c26 100644 --- a/turbo.json +++ b/turbo.json @@ -1,6 +1,6 @@ { "$schema": "https://turborepo.org/schema.json", - "pipeline": { + "tasks": { "build": { "dependsOn": ["prep"] }, From 238026ecc8a1347b26018c0702542d3334de24e1 Mon Sep 17 00:00:00 2001 From: Alex Tkachev Date: Wed, 3 Jul 2024 14:46:31 +0400 Subject: [PATCH 2/6] chore: fix type error --- apps/preview/src/App.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/preview/src/App.tsx b/apps/preview/src/App.tsx index 981244d51..496eb5f68 100644 --- a/apps/preview/src/App.tsx +++ b/apps/preview/src/App.tsx @@ -13,7 +13,7 @@ declare global { } } -const updates$ = webSocket({ +const updates$ = webSocket({ url: `${window.location.origin.replace('http', 'ws')}/__preview`, }).pipe( retry({ From 671d60fe1504f21828b4750f08691f7b276bdc75 Mon Sep 17 00:00:00 2001 From: Philipp Melab Date: Thu, 27 Jun 2024 12:20:15 +0200 Subject: [PATCH 3/6] refactor: update to rsc-compatible packages And fix all breaking changes. --- apps/decap/package.json | 2 +- apps/decap/src/helpers/frame.tsx | 45 +- apps/decap/src/main.tsx | 8 +- apps/preview/src/App.tsx | 10 +- apps/website/package.json | 4 +- apps/website/src/layouts/index.tsx | 14 +- apps/website/src/pages/404.tsx | 8 +- apps/website/src/templates/home.tsx | 10 +- apps/website/src/templates/page.tsx | 20 +- apps/website/src/utils/locale.ts | 33 + packages/schema/package.json | 4 +- packages/schema/src/index.ts | 50 +- packages/schema/src/schema.graphql | 3 +- packages/ui/.storybook/preview.tsx | 2 +- packages/ui/package.json | 4 +- .../ui/src/components/Client/MobileMenu.tsx | 2 +- .../Molecules/Breadcrumbs.stories.tsx | 8 +- .../Molecules/InquiryForm.stories.tsx | 8 +- .../src/components/Molecules/InquiryForm.tsx | 2 +- .../Molecules/LanguageSwitcher.stories.tsx | 41 +- .../components/Molecules/LanguageSwitcher.tsx | 1 + .../components/Molecules/PageTransition.tsx | 17 +- .../src/components/Molecules/Pagination.tsx | 2 +- .../src/components/Molecules/SearchForm.tsx | 2 +- .../Organisms/ContentHub.stories.tsx | 20 +- .../src/components/Organisms/ContentHub.tsx | 2 +- .../components/Organisms/Footer.stories.tsx | 13 +- .../ui/src/components/Organisms/Footer.tsx | 3 +- .../components/Organisms/Header.stories.tsx | 13 +- .../ui/src/components/Organisms/Header.tsx | 3 +- .../ui/src/components/Organisms/Inquiry.tsx | 1 + .../src/components/Organisms/PageDisplay.tsx | 1 + .../ui/src/components/Routes/ContentHub.tsx | 20 +- .../src/components/Routes/Frame.stories.tsx | 8 +- packages/ui/src/components/Routes/Frame.tsx | 81 +- .../ui/src/components/Routes/HomePage.tsx | 34 +- packages/ui/src/components/Routes/Inquiry.tsx | 13 +- packages/ui/src/components/Routes/Menu.tsx | 2 +- .../ui/src/components/Routes/NotFoundPage.tsx | 29 +- .../ui/src/components/Routes/Page.stories.tsx | 15 +- packages/ui/src/components/Routes/Page.tsx | 30 +- packages/ui/src/components/Routes/Preview.tsx | 1 + packages/ui/src/pages.stories.tsx | 37 +- packages/ui/src/utils/language-negotiator.tsx | 22 + .../{schema/src => ui/src/utils}/locale.ts | 8 +- packages/ui/src/utils/operation.ts | 7 +- packages/ui/src/utils/translations.tsx | 33 +- packages/ui/src/utils/with-operation.tsx | 27 + pnpm-lock.yaml | 1686 +++++++++++------ 49 files changed, 1602 insertions(+), 807 deletions(-) create mode 100644 apps/website/src/utils/locale.ts create mode 100644 packages/ui/src/utils/language-negotiator.tsx rename packages/{schema/src => ui/src/utils}/locale.ts (79%) create mode 100644 packages/ui/src/utils/with-operation.tsx diff --git a/apps/decap/package.json b/apps/decap/package.json index 4ed3ea046..fbd478fcb 100644 --- a/apps/decap/package.json +++ b/apps/decap/package.json @@ -32,7 +32,7 @@ "remark-rehype": "^10.1.0", "unified": "^10.1.2", "yaml": "^2.3.4", - "zod": "^3.22.4" + "zod": "^3.23.8" }, "devDependencies": { "@amazeelabs/decap-cms-backend-token-auth": "^1.1.7", diff --git a/apps/decap/src/helpers/frame.tsx b/apps/decap/src/helpers/frame.tsx index 192a4ab00..c181fa330 100644 --- a/apps/decap/src/helpers/frame.tsx +++ b/apps/decap/src/helpers/frame.tsx @@ -1,4 +1,9 @@ -import { FrameQuery, Locale, OperationExecutor, Url } from '@custom/schema'; +import { + FrameQuery, + Locale, + OperationExecutorsProvider, + Url, +} from '@custom/schema'; import { NavigationItemSource } from '@custom/schema/source'; import { Frame } from '@custom/ui/routes/Frame'; import { PropsWithChildren } from 'react'; @@ -16,25 +21,29 @@ const menuItems = (amount: number) => export function PreviewFrame({ children }: PropsWithChildren) { return ( - {children} - + ); } diff --git a/apps/decap/src/main.tsx b/apps/decap/src/main.tsx index 8514165f0..5a9d031d8 100644 --- a/apps/decap/src/main.tsx +++ b/apps/decap/src/main.tsx @@ -1,7 +1,7 @@ import { TokenAuthBackend } from '@amazeelabs/decap-cms-backend-token-auth/backend'; import { Locale, - OperationExecutor, + OperationExecutorsProvider, PreviewDecapPageQuery, ViewPageQuery, } from '@custom/schema'; @@ -95,9 +95,11 @@ CMS.registerPreviewTemplate( pageSchema, (data) => { return ( - + - + ); }, 'previewDecapPage', diff --git a/apps/preview/src/App.tsx b/apps/preview/src/App.tsx index 496eb5f68..572f93bd0 100644 --- a/apps/preview/src/App.tsx +++ b/apps/preview/src/App.tsx @@ -1,4 +1,4 @@ -import { OperationExecutor } from '@custom/schema'; +import { OperationExecutorsProvider } from '@custom/schema'; import { Frame } from '@custom/ui/routes/Frame'; import { Preview, usePreviewRefresh } from '@custom/ui/routes/Preview'; import { useEffect } from 'react'; @@ -24,17 +24,17 @@ const updates$ = webSocket({ function App() { const refresh = usePreviewRefresh(); useEffect(() => { - const sub = updates$.subscribe(refresh); + const sub = updates$.subscribe(() => refresh({})); return sub.unsubscribe; }, [refresh]); return ( - - + ); } diff --git a/apps/website/package.json b/apps/website/package.json index 8ba4d3ae7..c1a3ec4c4 100644 --- a/apps/website/package.json +++ b/apps/website/package.json @@ -35,8 +35,8 @@ "@netlify/edge-functions": "^2.3.1", "@netlify/functions": "^2.6.0", "@testing-library/react": "^14.1.2", - "@types/react": "^18.2.46", - "@types/react-dom": "^18.2.18", + "@types/react": "^18.3.3", + "@types/react-dom": "^18.3.0", "@types/serve-static": "^1.15.5", "happy-dom": "^12.10.3", "start-server-and-test": "^2.0.3", diff --git a/apps/website/src/layouts/index.tsx b/apps/website/src/layouts/index.tsx index 6bc8438cf..f5ff0c329 100644 --- a/apps/website/src/layouts/index.tsx +++ b/apps/website/src/layouts/index.tsx @@ -1,5 +1,5 @@ import { graphql, useStaticQuery } from '@amazeelabs/gatsby-plugin-operations'; -import { FrameQuery, OperationExecutor } from '@custom/schema'; +import { FrameQuery, OperationExecutorsProvider } from '@custom/schema'; import { Frame } from '@custom/ui/routes/Frame'; import React, { PropsWithChildren } from 'react'; @@ -12,10 +12,14 @@ export default function Layout({ }>) { const data = useStaticQuery(graphql(FrameQuery)); return ( - - + + {children} - - + + ); } diff --git a/apps/website/src/pages/404.tsx b/apps/website/src/pages/404.tsx index a7062457c..bfe49d2c4 100644 --- a/apps/website/src/pages/404.tsx +++ b/apps/website/src/pages/404.tsx @@ -1,5 +1,5 @@ import { graphql } from '@amazeelabs/gatsby-plugin-operations'; -import { NotFoundPageQuery, OperationExecutor } from '@custom/schema'; +import { NotFoundPageQuery, OperationExecutorsProvider } from '@custom/schema'; import { NotFoundPage } from '@custom/ui/routes/NotFoundPage'; import { PageProps } from 'gatsby'; import React from 'react'; @@ -8,8 +8,10 @@ export const query = graphql(NotFoundPageQuery); export default function Index({ data }: PageProps) { return ( - + - + ); } diff --git a/apps/website/src/templates/home.tsx b/apps/website/src/templates/home.tsx index 22096d7e6..8c149c00a 100644 --- a/apps/website/src/templates/home.tsx +++ b/apps/website/src/templates/home.tsx @@ -1,9 +1,11 @@ import { graphql } from '@amazeelabs/gatsby-plugin-operations'; -import { HomePageQuery, OperationExecutor, useLocalized } from '@custom/schema'; +import { HomePageQuery, OperationExecutorsProvider } from '@custom/schema'; import { HomePage } from '@custom/ui/routes/HomePage'; import { HeadProps, PageProps } from 'gatsby'; import React from 'react'; +import { useLocalized } from '../utils/locale'; + export const query = graphql(HomePageQuery); export function Head({ data }: HeadProps) { @@ -37,8 +39,10 @@ export function Head({ data }: HeadProps) { export default function Index({ data }: PageProps) { return ( - + - + ); } diff --git a/apps/website/src/templates/page.tsx b/apps/website/src/templates/page.tsx index f707acbb5..63510fcdb 100644 --- a/apps/website/src/templates/page.tsx +++ b/apps/website/src/templates/page.tsx @@ -1,5 +1,9 @@ import { graphql } from '@amazeelabs/gatsby-plugin-operations'; -import { OperationExecutor, useLocation, ViewPageQuery } from '@custom/schema'; +import { + OperationExecutorsProvider, + useLocation, + ViewPageQuery, +} from '@custom/schema'; import { Page } from '@custom/ui/routes/Page'; import { HeadProps, PageProps } from 'gatsby'; import React from 'react'; @@ -42,12 +46,16 @@ export default function PageTemplate({ data }: PageProps) { // path immediately returns this data. const [location] = useLocation(); return ( - - + ); } diff --git a/apps/website/src/utils/locale.ts b/apps/website/src/utils/locale.ts new file mode 100644 index 000000000..1e7b2699c --- /dev/null +++ b/apps/website/src/utils/locale.ts @@ -0,0 +1,33 @@ +// TODO: straight copy of the same file in the UI package +import { Locale, useLocation } from '@custom/schema'; + +const locales = Object.values(Locale); +export const defaultLocale: Locale = 'en'; + +export function isLocale(input: any): input is Locale { + return locales.includes(input); +} + +/** + * Extract the current locale from the path prefix. + */ +export function useLocale() { + const [{ pathname }] = useLocation(); + const prefix = pathname.split('/')[1]; + return isLocale(prefix) ? prefix : defaultLocale; +} + +type Localized = { locale: Locale }; + +/** + * Select the most appropriate of localization from a list of options. + */ +export function useLocalized( + options?: Array, +): T | undefined { + const locale = useLocale(); + return ( + options?.filter((option) => option?.locale === locale).pop() || + options?.filter((option) => option?.locale === defaultLocale).pop() + ); +} diff --git a/packages/schema/package.json b/packages/schema/package.json index bcbdd2da1..31e80ec03 100644 --- a/packages/schema/package.json +++ b/packages/schema/package.json @@ -46,7 +46,7 @@ }, "devDependencies": { "@amazeelabs/codegen-autoloader": "^1.1.3", - "@amazeelabs/codegen-operation-ids": "^0.1.34", + "@amazeelabs/codegen-operation-ids": "^0.1.43", "@graphql-codegen/cli": "^5.0.0", "@graphql-codegen/schema-ast": "^4.0.0", "@graphql-codegen/typescript": "^4.0.1", @@ -62,7 +62,7 @@ "typescript": "^5.3.3" }, "dependencies": { - "@amazeelabs/executors": "^2.0.2", + "@amazeelabs/executors": "^3.0.3", "@amazeelabs/gatsby-silverback-cloudinary": "^1.2.7", "@amazeelabs/gatsby-source-silverback": "^1.14.0", "@amazeelabs/scalars": "^1.6.13", diff --git a/packages/schema/src/index.ts b/packages/schema/src/index.ts index 42559e8d3..35efe8b34 100644 --- a/packages/schema/src/index.ts +++ b/packages/schema/src/index.ts @@ -1,48 +1,8 @@ -import { - OperationExecutor as UntypedOperationExecutor, - useExecutor as untypedUseExecutor, -} from '@amazeelabs/executors'; -import { PropsWithChildren } from 'react'; - -import type { +export * from './generated/index.js'; +export * from '@amazeelabs/scalars'; +export * from '@amazeelabs/executors'; +export type { AnyOperationId, OperationResult, OperationVariables, -} from './generated/index.js'; - -export * from './generated/index.js'; -export * from '@amazeelabs/scalars'; - -export * from './locale.js'; - -type Executor = - | OperationResult - | (( - id: OperationId, - variables: OperationVariables, - ) => OperationResult | Promise>); - -type VariablesMatcher = - | Partial> - | ((vars: OperationVariables) => boolean); - -export function OperationExecutor( - props: PropsWithChildren<{ - id?: OperationId; - variables?: VariablesMatcher>; - executor: Executor; - }>, -) { - return UntypedOperationExecutor(props); -} - -export function useExecutor( - id: OperationId, - variables?: OperationVariables, -): - | OperationResult - | (( - variables?: OperationVariables, - ) => Promise>) { - return untypedUseExecutor(id, variables); -} +} from '@amazeelabs/codegen-operation-ids'; diff --git a/packages/schema/src/schema.graphql b/packages/schema/src/schema.graphql index 4c0150a42..8784b0a90 100644 --- a/packages/schema/src/schema.graphql +++ b/packages/schema/src/schema.graphql @@ -65,7 +65,7 @@ directive @decapPageTranslations on FIELD_DEFINITION """ Parse a given Url. -For Drupal, this is implicitly implemented in the "grraphql_directives" module. +For Drupal, this is implicitly implemented in the "graphql_directives" module. implementation(gatsby): ./page.js#route """ @@ -392,7 +392,6 @@ type DemoBlock { """ The type provided by translations source (e.g. Decap or Drupal). -Ingested by @mergeTranslatableStrings which handles priorities. """ interface TranslatableString @default @value { """ diff --git a/packages/ui/.storybook/preview.tsx b/packages/ui/.storybook/preview.tsx index 371952850..d0a2f9e0b 100644 --- a/packages/ui/.storybook/preview.tsx +++ b/packages/ui/.storybook/preview.tsx @@ -3,7 +3,7 @@ import '../src/tailwind.css'; import { LocationProvider } from '@custom/schema'; import { Decorator } from '@storybook/react'; import React from 'react'; -import { IntlProvider } from 'react-intl'; +import { IntlProvider } from '@amazeelabs/react-intl'; import { SWRConfig, useSWRConfig } from 'swr'; // Every story is wrapped in an IntlProvider by default. diff --git a/packages/ui/package.json b/packages/ui/package.json index 351391524..5aa19dc32 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -39,6 +39,7 @@ "report": "mkdir -p coverage/storybook && nyc report --reporter=lcov -t coverage/storybook --report-dir coverage/storybook" }, "dependencies": { + "@amazeelabs/react-intl": "^1.1.1", "@amazeelabs/silverback-iframe": "^1.3.0", "@custom/schema": "workspace:*", "@headlessui/react": "^2.0.3", @@ -50,10 +51,9 @@ "hast-util-select": "^5.0.5", "query-string": "^9.0.0", "react-hook-form": "^7.49.2", - "react-intl": "^6.6.2", "swr": "^2.2.4", "unified": "^10.1.2", - "zod": "^3.22.4", + "zod": "^3.23.8", "zustand": "^4.4.7" }, "peerDependencies": { diff --git a/packages/ui/src/components/Client/MobileMenu.tsx b/packages/ui/src/components/Client/MobileMenu.tsx index 022402639..4a3bf3abb 100644 --- a/packages/ui/src/components/Client/MobileMenu.tsx +++ b/packages/ui/src/components/Client/MobileMenu.tsx @@ -1,4 +1,5 @@ 'use client'; +import { useIntl } from '@amazeelabs/react-intl'; import { Dialog, DialogPanel, @@ -9,7 +10,6 @@ import { import { ChevronDownIcon } from '@heroicons/react/20/solid'; import clsx from 'clsx'; import React, { createContext, PropsWithChildren } from 'react'; -import { useIntl } from 'react-intl'; const MobileMenuContext = createContext({ isOpen: false, diff --git a/packages/ui/src/components/Molecules/Breadcrumbs.stories.tsx b/packages/ui/src/components/Molecules/Breadcrumbs.stories.tsx index 6fafb4f0a..2ae3abc27 100644 --- a/packages/ui/src/components/Molecules/Breadcrumbs.stories.tsx +++ b/packages/ui/src/components/Molecules/Breadcrumbs.stories.tsx @@ -1,4 +1,4 @@ -import { FrameQuery, OperationExecutor } from '@custom/schema'; +import { FrameQuery, OperationExecutorsProvider } from '@custom/schema'; import { Meta, StoryObj } from '@storybook/react'; import React from 'react'; @@ -12,9 +12,11 @@ export default { }, render: () => { return ( - + - + ); }, } satisfies Meta; diff --git a/packages/ui/src/components/Molecules/InquiryForm.stories.tsx b/packages/ui/src/components/Molecules/InquiryForm.stories.tsx index 853793c16..c1576a302 100644 --- a/packages/ui/src/components/Molecules/InquiryForm.stories.tsx +++ b/packages/ui/src/components/Molecules/InquiryForm.stories.tsx @@ -1,6 +1,6 @@ import { CreateSubmissionMutation, - OperationExecutor, + OperationExecutorsProvider, OperationResult, } from '@custom/schema'; import { Meta, StoryObj } from '@storybook/react'; @@ -17,9 +17,11 @@ export default { title: 'Components/Molecules/InquiryForm', render: (args) => { return ( - + - + ); }, } satisfies Meta<{ exec: InquiryFormExecutor }>; diff --git a/packages/ui/src/components/Molecules/InquiryForm.tsx b/packages/ui/src/components/Molecules/InquiryForm.tsx index c58db3309..1ae6c5d39 100644 --- a/packages/ui/src/components/Molecules/InquiryForm.tsx +++ b/packages/ui/src/components/Molecules/InquiryForm.tsx @@ -1,7 +1,7 @@ +import { useIntl } from '@amazeelabs/react-intl'; import { CreateSubmissionMutation } from '@custom/schema'; import React from 'react'; import { useForm } from 'react-hook-form'; -import { useIntl } from 'react-intl'; import { z } from 'zod'; import { useMutation } from '../../utils/operation'; diff --git a/packages/ui/src/components/Molecules/LanguageSwitcher.stories.tsx b/packages/ui/src/components/Molecules/LanguageSwitcher.stories.tsx index e31a6bc01..7efbef9b3 100644 --- a/packages/ui/src/components/Molecules/LanguageSwitcher.stories.tsx +++ b/packages/ui/src/components/Molecules/LanguageSwitcher.stories.tsx @@ -1,33 +1,40 @@ -import { FrameQuery, OperationExecutor, Url } from '@custom/schema'; +import { FrameQuery, OperationExecutorsProvider, Url } from '@custom/schema'; import { Decorator, Meta, StoryObj } from '@storybook/react'; import React from 'react'; -import { Translations, TranslationsProvider } from '../../utils/translations'; +import { + TranslationPaths, + TranslationsProvider, +} from '../../utils/translations'; import { Default } from '../Routes/Frame.stories'; import { LanguageSwitcher } from './LanguageSwitcher'; const TranslationsDecorator = ((Story, ctx) => { return ( - - + ); -}) as Decorator; +}) as Decorator; export default { component: LanguageSwitcher, @@ -35,9 +42,9 @@ export default { parameters: { location: new URL('local:/en/english-version'), }, -} satisfies Meta; +} satisfies Meta; -type Story = StoryObj; +type Story = StoryObj; export const Empty = {} satisfies Story; diff --git a/packages/ui/src/components/Molecules/LanguageSwitcher.tsx b/packages/ui/src/components/Molecules/LanguageSwitcher.tsx index c77683543..05550c75a 100644 --- a/packages/ui/src/components/Molecules/LanguageSwitcher.tsx +++ b/packages/ui/src/components/Molecules/LanguageSwitcher.tsx @@ -1,3 +1,4 @@ +'use client'; import { Link, Locale, useLocation } from '@custom/schema'; import { Menu, Transition } from '@headlessui/react'; import { ChevronDownIcon } from '@heroicons/react/20/solid'; diff --git a/packages/ui/src/components/Molecules/PageTransition.tsx b/packages/ui/src/components/Molecules/PageTransition.tsx index 5b52b4bd8..8b859577d 100644 --- a/packages/ui/src/components/Molecules/PageTransition.tsx +++ b/packages/ui/src/components/Molecules/PageTransition.tsx @@ -1,9 +1,24 @@ +'use client'; import { Locale } from '@custom/schema'; -import { motion, useReducedMotion } from 'framer-motion'; +import { AnimatePresence, motion, useReducedMotion } from 'framer-motion'; import React, { PropsWithChildren, ReactNode, useEffect } from 'react'; import { Messages, readMessages } from './Messages'; +export function PageTransitionWrapper({ children }: PropsWithChildren) { + return ( +
+ {useReducedMotion() ? ( + <>{children} + ) : ( + + {children} + + )} +
+ ); +} + export function PageTransition({ children }: PropsWithChildren) { const [messages, setMessages] = React.useState>([]); const [messageComponents, setMessageComponents] = React.useState< diff --git a/packages/ui/src/components/Molecules/Pagination.tsx b/packages/ui/src/components/Molecules/Pagination.tsx index d85beb270..f26b76880 100644 --- a/packages/ui/src/components/Molecules/Pagination.tsx +++ b/packages/ui/src/components/Molecules/Pagination.tsx @@ -1,3 +1,4 @@ +import { useIntl } from '@amazeelabs/react-intl'; import { Link, useLocation } from '@custom/schema'; import { ArrowLongLeftIcon, @@ -5,7 +6,6 @@ import { } from '@heroicons/react/20/solid'; import clsx from 'clsx'; import React from 'react'; -import { useIntl } from 'react-intl'; import { z } from 'zod'; export const paginationParamsSchema = z.object({ diff --git a/packages/ui/src/components/Molecules/SearchForm.tsx b/packages/ui/src/components/Molecules/SearchForm.tsx index e043a6fcd..989a49fe3 100644 --- a/packages/ui/src/components/Molecules/SearchForm.tsx +++ b/packages/ui/src/components/Molecules/SearchForm.tsx @@ -1,8 +1,8 @@ +import { useIntl } from '@amazeelabs/react-intl'; import { useLocation } from '@custom/schema'; import { zodResolver } from '@hookform/resolvers/zod'; import React from 'react'; import { useForm } from 'react-hook-form'; -import { useIntl } from 'react-intl'; import { z } from 'zod'; const formValueSchema = z.object({ diff --git a/packages/ui/src/components/Organisms/ContentHub.stories.tsx b/packages/ui/src/components/Organisms/ContentHub.stories.tsx index 864d92352..ee15a86c4 100644 --- a/packages/ui/src/components/Organisms/ContentHub.stories.tsx +++ b/packages/ui/src/components/Organisms/ContentHub.stories.tsx @@ -1,7 +1,7 @@ import { ContentHubQuery, ContentHubResultItemFragment, - OperationExecutor, + OperationExecutorsProvider, OperationResult, OperationVariables, Url, @@ -26,9 +26,11 @@ export default { title: 'Components/Organisms/ContentHub', render: (args) => { return ( - + - + ); }, } satisfies Meta<{ exec: ContentHubExecutor }>; @@ -58,7 +60,7 @@ export const Error = { }, } satisfies ContentHubStory; -export const WithResults = { +export const WithResults: ContentHubStory = { args: { exec: async (_, vars) => { const items = [...Array(82).keys()].map( @@ -93,18 +95,18 @@ export const WithResults = { }; }, }, -} satisfies ContentHubStory; +}; -export const Filtered = { +export const Filtered: ContentHubStory = { ...WithResults, parameters: { location: new URL('local:/content-hub?keyword=Article'), }, -} satisfies ContentHubStory; +}; -export const Paged = { +export const Paged: ContentHubStory = { ...WithResults, parameters: { location: new URL('local:/content-hub?page=2'), }, -} satisfies ContentHubStory; +}; diff --git a/packages/ui/src/components/Organisms/ContentHub.tsx b/packages/ui/src/components/Organisms/ContentHub.tsx index c6ccd3475..5dface3d5 100644 --- a/packages/ui/src/components/Organisms/ContentHub.tsx +++ b/packages/ui/src/components/Organisms/ContentHub.tsx @@ -1,7 +1,7 @@ +import { useIntl } from '@amazeelabs/react-intl'; import { ContentHubQuery, Image, Link, Locale } from '@custom/schema'; import qs from 'query-string'; import React from 'react'; -import { useIntl } from 'react-intl'; import { isTruthy } from '../../utils/isTruthy'; import { useOperation } from '../../utils/operation'; diff --git a/packages/ui/src/components/Organisms/Footer.stories.tsx b/packages/ui/src/components/Organisms/Footer.stories.tsx index abef3981e..d3bef7003 100644 --- a/packages/ui/src/components/Organisms/Footer.stories.tsx +++ b/packages/ui/src/components/Organisms/Footer.stories.tsx @@ -1,4 +1,9 @@ -import { FrameQuery, Locale, OperationExecutor, Url } from '@custom/schema'; +import { + FrameQuery, + Locale, + OperationExecutorsProvider, + Url, +} from '@custom/schema'; import { Meta, StoryObj } from '@storybook/react'; import React from 'react'; @@ -14,9 +19,11 @@ export default { export const Footer = { render: (args) => { return ( - args}> + - + ); }, args: { diff --git a/packages/ui/src/components/Organisms/Footer.tsx b/packages/ui/src/components/Organisms/Footer.tsx index 73dc34bdf..e66a600da 100644 --- a/packages/ui/src/components/Organisms/Footer.tsx +++ b/packages/ui/src/components/Organisms/Footer.tsx @@ -1,6 +1,7 @@ +'use client'; +import { useIntl } from '@amazeelabs/react-intl'; import { FrameQuery, Link } from '@custom/schema'; import React from 'react'; -import { useIntl } from 'react-intl'; import { isTruthy } from '../../utils/isTruthy'; import { buildNavigationTree } from '../../utils/navigation'; diff --git a/packages/ui/src/components/Organisms/Header.stories.tsx b/packages/ui/src/components/Organisms/Header.stories.tsx index c895dfe2e..84e06473d 100644 --- a/packages/ui/src/components/Organisms/Header.stories.tsx +++ b/packages/ui/src/components/Organisms/Header.stories.tsx @@ -1,4 +1,9 @@ -import { FrameQuery, Locale, OperationExecutor, Url } from '@custom/schema'; +import { + FrameQuery, + Locale, + OperationExecutorsProvider, + Url, +} from '@custom/schema'; import { Meta, StoryObj } from '@storybook/react'; import { userEvent, within } from '@storybook/test'; import React from 'react'; @@ -16,9 +21,11 @@ export default { export const Idle = { render: (args) => { return ( - args}> +
- + ); }, args: { diff --git a/packages/ui/src/components/Organisms/Header.tsx b/packages/ui/src/components/Organisms/Header.tsx index b132e4ceb..d9ef03f49 100644 --- a/packages/ui/src/components/Organisms/Header.tsx +++ b/packages/ui/src/components/Organisms/Header.tsx @@ -1,7 +1,8 @@ +'use client'; +import { useIntl } from '@amazeelabs/react-intl'; import { FrameQuery, Link, Url } from '@custom/schema'; import clsx from 'clsx'; import React from 'react'; -import { useIntl } from 'react-intl'; import { isTruthy } from '../../utils/isTruthy'; import { buildNavigationTree } from '../../utils/navigation'; diff --git a/packages/ui/src/components/Organisms/Inquiry.tsx b/packages/ui/src/components/Organisms/Inquiry.tsx index 6a5bb6404..21441243c 100644 --- a/packages/ui/src/components/Organisms/Inquiry.tsx +++ b/packages/ui/src/components/Organisms/Inquiry.tsx @@ -1,3 +1,4 @@ +'use client'; import React from 'react'; import { InquiryForm } from '../Molecules/InquiryForm'; diff --git a/packages/ui/src/components/Organisms/PageDisplay.tsx b/packages/ui/src/components/Organisms/PageDisplay.tsx index 438d43893..c5999faf9 100644 --- a/packages/ui/src/components/Organisms/PageDisplay.tsx +++ b/packages/ui/src/components/Organisms/PageDisplay.tsx @@ -1,3 +1,4 @@ +'use client'; import { PageFragment } from '@custom/schema'; import React from 'react'; diff --git a/packages/ui/src/components/Routes/ContentHub.tsx b/packages/ui/src/components/Routes/ContentHub.tsx index c9b001b80..1cf661b62 100644 --- a/packages/ui/src/components/Routes/ContentHub.tsx +++ b/packages/ui/src/components/Routes/ContentHub.tsx @@ -1,20 +1,24 @@ +'use client'; import { Locale } from '@custom/schema'; import React from 'react'; -import { useTranslations } from '../../utils/translations'; +import { Translations } from '../../utils/translations'; import { PageTransition } from '../Molecules/PageTransition'; import { ContentHub as ContentHubOrganism } from '../Organisms/ContentHub'; export function ContentHub(props: { pageSize: number }) { - // Initialize the content hub in each language. - useTranslations( - Object.fromEntries( - Object.values(Locale).map((locale) => [locale, `/${locale}/content-hub`]), - ), - ); return ( - + [ + locale, + `/${locale}/content-hub`, + ]), + )} + > + + ); } diff --git a/packages/ui/src/components/Routes/Frame.stories.tsx b/packages/ui/src/components/Routes/Frame.stories.tsx index a100b1016..efaca21e6 100644 --- a/packages/ui/src/components/Routes/Frame.stories.tsx +++ b/packages/ui/src/components/Routes/Frame.stories.tsx @@ -1,4 +1,4 @@ -import { FrameQuery, OperationExecutor } from '@custom/schema'; +import { FrameQuery, OperationExecutorsProvider } from '@custom/schema'; import { Meta, StoryObj } from '@storybook/react'; import React from 'react'; @@ -16,9 +16,11 @@ export default { export const Default = { render: (args) => { return ( - args} id={FrameQuery}> + - + ); }, args: { diff --git a/packages/ui/src/components/Routes/Frame.tsx b/packages/ui/src/components/Routes/Frame.tsx index 6efe5c1c9..2ab1ec148 100644 --- a/packages/ui/src/components/Routes/Frame.tsx +++ b/packages/ui/src/components/Routes/Frame.tsx @@ -1,11 +1,11 @@ -import { FrameQuery, Locale, useLocale } from '@custom/schema'; -import { AnimatePresence, useReducedMotion } from 'framer-motion'; +import { IntlProvider } from '@amazeelabs/react-intl'; +import { FrameQuery, Locale, Operation } from '@custom/schema'; import React, { PropsWithChildren } from 'react'; -import { IntlProvider } from 'react-intl'; import translationSources from '../../../build/translatables.json'; -import { useOperation } from '../../utils/operation'; +import { useLocale } from '../../utils/locale'; import { TranslationsProvider } from '../../utils/translations'; +import { PageTransitionWrapper } from '../Molecules/PageTransition'; import { Footer } from '../Organisms/Footer'; import { Header } from '../Organisms/Header'; @@ -30,44 +30,43 @@ function translationsMap(translatables: FrameQuery['stringTranslations']) { ); } -function useTranslations() { +export function Frame({ children }: PropsWithChildren) { const locale = useLocale(); - const translations = useOperation(FrameQuery).data?.stringTranslations; - return { - ...translationsMap(translations?.filter(filterByLocale('en')) || []), - ...translationsMap(translations?.filter(filterByLocale(locale)) || []), - }; -} - -export function Frame(props: PropsWithChildren<{}>) { - const locale = useLocale(); - const translations = useTranslations(); - const messages = Object.fromEntries( - Object.keys(translationSources).map((key) => [ - key, - translations[ - translationSources[key as keyof typeof translationSources] - .defaultMessage - ] || - translationSources[key as keyof typeof translationSources] - .defaultMessage, - ]), - ); return ( - - -
-
- {useReducedMotion() ? ( - <>{props.children} - ) : ( - - {props.children} - - )} -
-