From 5692ef31ba21d8ad0a5aa718d58b0349b143818e Mon Sep 17 00:00:00 2001 From: Adam Matthiesen Date: Wed, 20 Nov 2024 10:38:10 -0800 Subject: [PATCH] Start of dashboard i18n logic & implement on new Auth pages (#372) * start of i18n support * add changeset * add docs * move functions around and add jsdocs * Added translation using Weblate (German) (#374) Co-authored-by: Louis Escher * add labeler * Add @changesets/write and execa dependencies and implement automatated changesets for translations * Refactor translation-changesets workflow to remove unnecessary code * Update workflow * simplify * Refactor translation-changesets workflow to use GitHub Actions expression syntax * fix * add new custom script to replace github-script that was not working * Refactor translation-changesets workflow to fix command typo * Core i18n:Translations update from StudioCMS i18n (#376) * Translated using Weblate (German) Currently translated at 58.0% (18 of 31 strings) Translated using Weblate (German) Currently translated at 12.9% (4 of 31 strings) Co-authored-by: Louis Escher Translate-URL: https://i18n.studiocms.xyz/projects/studiocms/core-i18n/de/ Translation: StudioCMS/Core i18n * [ci] changesets * [ci] changesets * Delete .changeset/dry-zoos-behave.md bug --------- Co-authored-by: Louis Escher Co-authored-by: Adam Matthiesen * Update www/docs/src/content/docs/contributing/getting-started.mdx Co-authored-by: Reuben Tier <64310361+TheOtterlord@users.noreply.github.com> * move info around to fix the new contributing sections * Remove css imports * Add theme helper, theme toggle component, docs (#377) * Create draft PR for #351 [skip ci] * version and prep docs * Style adjustments to docs * Revert text change * update og images to conform to twitter guidelines * update lockfile * fix lint errors * refactor docs to cleanup the whole thing * remove now unneeded package * update typedoc config * dep cleanup * Refactor Integration.astro to display "N/A" for unreleased packages * update pageTitle to support integrations * add sponsors section * up * Refactor Sponsors.astro to add target and rel attributes to sponsor link * Update sidebar label * Refactor Integration.astro to add support for plugins * add note to styles * update label * Refactor Astro config to add support for @studiocms/blog plugin * fix * Refactor Astro config to remove isScoped and scope properties * Refactor Astro config to remove unused code and improve package name parsing * Refactor Sponsors component styles to center align links and headings * fix icon * Refactor packagecatalog config to remove extra code and improve package name parsing * fix config reference * Refactor PackageCatalog component to filter and sort packages based on pkgType prop * Refactor PackageCatalog component to use 'catalog' prop instead of 'pkgType' * Refactor Astro.props in Integration.astro to include publiclyUsable prop * Refactor config.ts to include redirectSchema * refactor * Refactor Astro.config.mts to include @shikijs/twoslash integration * Refactor Astro.config.mts to use StudioCMSOptions instead of StudioCMSOptionsSchema._input * Dashboard additions removals (#354) * Purge mentions of Astro Studio * Add UI docs (getting started & button) * Update packages/studiocms/src/index.ts Co-authored-by: Adam Matthiesen * Fix border rounding * Shrink hero * Update www/docs/astro.config.mts Co-authored-by: Adam Matthiesen * Finish button docs, fix merge conflicts * Add more UI lib docs, adjust UI package - Fixed a typo that caused a typedoc warning. -Fixed a CSS leak in the UI library. - Adjusted the DropdownHelper API (added an individual show toggle and renamed some functions) - Looooooooooots more docs stuff * Update button.mdx * Adjust wording * Update dropdown.mdx * Add more UI docs, fix UI lib css * Adjust sponsors css, add more UI lib docs * Improve code snippets * Document textarea, toggle, and user * Changes to UI lib, new UI lib docs * Fix missing comma * Update custom.css * mention include styles * Adjustments for twoslash * Update custom.css * Twoslash more like twobitch * Funny markdown support :) * Made twoslash appear correctly * Add changesets * Add explicitTrigger for twoslash --------- Co-authored-by: Reuben Tier Co-authored-by: Adam Matthiesen * start of adding transformers and their css * more twoslash! * Update '@astrojs/starlight' version to 0.28.3 * Update dependencies for '@astrojs/starlight', '@astrojs/db', '@astrojs/node', '@astrojs/react', and '@astrojs/web-vitals' * test * apply fix * update docs and re-enable astro check * Update configuration.mdx with link to reference pages * Add description for StudioCMS DevApps * Refactor StudioCMS package.json exports * more progress * Update Astro version to 4.16.3 and adjust button position in custom.css * update default bracketPairs comment * update to conform to new astro docs and update other links * add ts-nocheck to prevent warnings/errors for shiki transformer * revert * new title transformer for shiki * add titles * cleanup * update demo link in code snippet * Update custom.css styles for code snippets * Update studiocms/src/index.ts and www/docs/src/content/docs/config-reference/options-schema.mdx * Refactor import statement in defineStudioCMSConfig.ts * fix the TS error that was being caused by a `.` instead of a `,` * some css styling for the copy button * update css * Update custom.css with new color tokens and styling for highlighted words and diffs * remove spacing * Update custom.css to add background color for highlighted words and diffs * Update custom.css to adjust background colors for highlighted words and diffs * fixed css * Update custom.css to remove inline-block display for diff spans * Remove test comment, fix copy SVGs, color changes * Add image zoom, remove carousel, adjust hero buttons * refactor css file into multiple files * Refactor shiki transformers and update import paths * Refactor Docs landing page * Refactor SplitCard component CSS * Refactor Youtube.astro component CSS * Refactor why-studioCMS.mdx file * Refactor card CSS to include all the cards from starlight * Refactor index.mdx to include instructions for setting up Turso database * Refactor Getting started guide and remove unused components * Refactor getting started guide * Refactor config references * Refactor config references and add Renderer type * Refactor StudioCMS custom renderer documentation to include information about defining custom renderers and their usage. * cleanup docs * Refactor environment variable documentation and add ReadMore component * Refactor YouTube and landing card components * Refactor Discord button styling in index.mdx and starlight.css * Refactor starlight.css: Add gap to LinkButton button styling * fix * Refactor SplitCard component: Add padding to split container * Refactor SplitCard component: Remove unnecessary padding in split container * Refactor landing page: Update StudioCMS card icon * Custom head component to preload the fonts * Add new component for planned Contributor guide page * Update sidebar component name, and update SiteTitle component * Update astro.config.mts: Add 'x.com' link to StudioCMS social media * Contributing guide! * Update astro.config.mts: Add remotePatterns for images Add new Contributing guide * Update FacePile component: Adjust avatar size and alignment * Update contributing guide * Update contributing guide: Add link to contributing guide in README.md * Update astro.config.mts: Add badge to @studiocms/ui label * Update contributing guide: Update link to contributors list in contributing.mdx * Update dependencies: Add hast-util-to-string, html-escaper, rehype-slug, rehype-autolink-headings, rehype-external-links, and @types/html-escaper * Update anchor link icon style * Update anchor link icon style and display of content elements * Update dependencies: Add shiki-transformer-color-highlight and unified * Update contributor list component and styles * Refactor getContributorsByPath function to remove ignored commit keywords and improve author handling * cleanup * Update external link icon and remove underline from anchor links * Update SiteTitle.astro * Add bun as a package manager option * Refactor getContributorsByPath function to improve author handling and remove ignored commit keywords * Refactor TursoCLI command builder for improved handling of authentication and database commands * Refactor to use dynamic sponsor links * Update strings.ts * Update why-studioCMS.mdx * Feat(devapps): Wordpress Importer (#360) * initial progress * okay well it works! * Add Wordpress importer app * Add WordPress Importer app and update README.md * update readme * update docs * Add Toolbar app image and update README.md * remove unnecessary footnote * Refactor wp-api converters and utils This commit refactors the wp-api converters and utils in the studiocms_devapps package. It introduces the following changes: - Added async/await functionality to ConvertToPageData and ConvertToPostData functions. - Implemented fetching and downloading of title images for pages and posts. - Updated the apiEndpoint function to include the 'media' type. These changes improve the efficiency and functionality of the wp-api converters and utils. * Refactor wp-api converters and utils, and add closeOnOutsideClick function * Refactor createWindowElement function and add closeOnOutsideClick function * Refactor TypeDoc configuration to include additional files * Refactor devApps configuration to include WP API Importer * typo * Refactor wp-api converters and utils, and fix success check in wp-importer * Refactor to remove warning as per @dreyfus92 * Update www/docs/src/content/docs/start-here/why-studioCMS.mdx Co-authored-by: Adam Matthiesen * Update www/docs/src/content/docs/start-here/why-studioCMS.mdx Co-authored-by: Adam Matthiesen * Update www/docs/src/content/docs/start-here/why-studioCMS.mdx Co-authored-by: Adam Matthiesen * Update www/docs/src/content/docs/start-here/why-studioCMS.mdx Co-authored-by: Adam Matthiesen * Update title in how-it-works/index.mdx * Fix twoslash popups overflowing parent container * Add theme helper, theme toggle component, docs * Remove unused function call * Update index.ts * Fix a typo in the JSDoc * Update theme-helper.mdx Added an example for how to store the theme * Update theme-helper.mdx --------- Co-authored-by: create-issue-branch[bot] <53036503+create-issue-branch[bot]@users.noreply.github.com> Co-authored-by: Adam Matthiesen Co-authored-by: Reuben Tier * Add Sentry monitoring (#378) * start - playground node * add sentry client config * add to ui-testing playground * add sentry release notification to release and snapshot actions * Add conditional step to create Sentry release * start of i18n support * add changeset * add docs * move functions around and add jsdocs * Added translation using Weblate (German) (#374) Co-authored-by: Louis Escher * add labeler * Add @changesets/write and execa dependencies and implement automatated changesets for translations * Refactor translation-changesets workflow to remove unnecessary code * Update workflow * simplify * Refactor translation-changesets workflow to use GitHub Actions expression syntax * fix * add new custom script to replace github-script that was not working * Refactor translation-changesets workflow to fix command typo * Core i18n:Translations update from StudioCMS i18n (#376) * Translated using Weblate (German) Currently translated at 58.0% (18 of 31 strings) Translated using Weblate (German) Currently translated at 12.9% (4 of 31 strings) Co-authored-by: Louis Escher Translate-URL: https://i18n.studiocms.xyz/projects/studiocms/core-i18n/de/ Translation: StudioCMS/Core i18n * [ci] changesets * [ci] changesets * Delete .changeset/dry-zoos-behave.md bug --------- Co-authored-by: Louis Escher Co-authored-by: Adam Matthiesen * Update www/docs/src/content/docs/contributing/getting-started.mdx Co-authored-by: Reuben Tier <64310361+TheOtterlord@users.noreply.github.com> * move info around to fix the new contributing sections * fix lockfile * fix lockfile * update sentry settings to enable session replay --------- Co-authored-by: StudioCMS (bot) Co-authored-by: Louis Escher Co-authored-by: Reuben Tier <64310361+TheOtterlord@users.noreply.github.com> Co-authored-by: Reuben Tier Co-authored-by: Louis Escher <66965600+louisescher@users.noreply.github.com> Co-authored-by: create-issue-branch[bot] <53036503+create-issue-branch[bot]@users.noreply.github.com> --- .changeset/long-cherries-exercise.md | 5 + .changeset/perfect-hornets-swim.md | 17 + .github/labeler.yml | 5 + .github/workflows/labeler.yml | 17 + .github/workflows/translation-changesets.yml | 46 + README.md | 6 +- package.json | 8 +- .../src/components/OAuthButtonStack.astro | 6 +- .../src/components/StaticAuthCheck.astro | 33 + packages/studiocms_auth/src/integration.ts | 8 +- .../src/layouts/AuthLayout.astro | 14 +- .../src/routes/{ => api}/logout.ts | 0 .../studiocms_auth/src/routes/login.astro | 43 +- .../studiocms_auth/src/routes/logout.astro | 33 + .../studiocms_auth/src/routes/signup.astro | 48 +- .../studiocms_auth/src/utils/routeBuilder.ts | 4 +- .../studiocms_core/src/helpers/routemap.ts | 1 + .../src/i18n/LanguageSelector.astro | 103 + packages/studiocms_core/src/i18n/index.ts | 170 ++ .../src/i18n/translations/de.json | 43 + .../src/i18n/translations/en-us.json | 43 + packages/studiocms_core/src/integration.ts | 2 + packages/studiocms_core/src/stubs/i18n-dts.ts | 107 + .../src/utils/coreVirtualModules.ts | 1 + playgrounds/node/astro.config.mts | 2 + playgrounds/node/sentry.client.config.js | 4 + pnpm-lock.yaml | 2214 +++++++---------- pnpm-workspace.yaml | 4 +- scripts/filter-warnings.cjs | 23 + scripts/translation-changeset.ts | 38 + www/docs/astro.config.mts | 4 + .../code-contributions.mdx} | 42 +- .../docs/contributing/getting-started.mdx | 24 + .../docs/contributing/translations.mdx | 30 + .../src/content/docs/how-it-works/index.mdx | 3 +- 35 files changed, 1778 insertions(+), 1373 deletions(-) create mode 100644 .changeset/long-cherries-exercise.md create mode 100644 .changeset/perfect-hornets-swim.md create mode 100644 .github/labeler.yml create mode 100644 .github/workflows/labeler.yml create mode 100644 .github/workflows/translation-changesets.yml create mode 100644 packages/studiocms_auth/src/components/StaticAuthCheck.astro rename packages/studiocms_auth/src/routes/{ => api}/logout.ts (100%) create mode 100644 packages/studiocms_auth/src/routes/logout.astro create mode 100644 packages/studiocms_core/src/i18n/LanguageSelector.astro create mode 100644 packages/studiocms_core/src/i18n/index.ts create mode 100644 packages/studiocms_core/src/i18n/translations/de.json create mode 100644 packages/studiocms_core/src/i18n/translations/en-us.json create mode 100644 packages/studiocms_core/src/stubs/i18n-dts.ts create mode 100644 scripts/filter-warnings.cjs create mode 100644 scripts/translation-changeset.ts rename www/docs/src/content/docs/{start-here/contributing.mdx => contributing/code-contributions.mdx} (71%) create mode 100644 www/docs/src/content/docs/contributing/getting-started.mdx create mode 100644 www/docs/src/content/docs/contributing/translations.mdx diff --git a/.changeset/long-cherries-exercise.md b/.changeset/long-cherries-exercise.md new file mode 100644 index 000000000..671718863 --- /dev/null +++ b/.changeset/long-cherries-exercise.md @@ -0,0 +1,5 @@ +--- +"@studiocms/core": patch +--- + +Translation Updated (PR: #376) diff --git a/.changeset/perfect-hornets-swim.md b/.changeset/perfect-hornets-swim.md new file mode 100644 index 000000000..a325e1055 --- /dev/null +++ b/.changeset/perfect-hornets-swim.md @@ -0,0 +1,17 @@ +--- +"studiocms": patch +"@studiocms/auth": patch +"@studiocms/core": patch +--- + +Introduce Dashboard i18n logic + +- `studiocms` & `@studiocms/core`: + - Introduce new virtual module `studiocms:i18n`: + This module includes utilities for our new i18n system. + - Add new LanguageSelector component + - Add `en-us` translation file. (`packages/studiocms_core/i18n/translations/`) + +- `@studiocms/auth`: + - Update login/signup routes to utilize new i18n translations + - Transition routes to Hybrid type setup, All API routes will remain server rendered, while pages are now prerendered (Server islands when needed). \ No newline at end of file diff --git a/.github/labeler.yml b/.github/labeler.yml new file mode 100644 index 000000000..4c6b1adeb --- /dev/null +++ b/.github/labeler.yml @@ -0,0 +1,5 @@ +# See https://github.com/actions/labeler/tree/main for more information about the labeler action + +translations: + - changed-files: + - any-glob-to-any-file: packages/studiocms_core/src/i18n/translations/* \ No newline at end of file diff --git a/.github/workflows/labeler.yml b/.github/workflows/labeler.yml new file mode 100644 index 000000000..8a76c8118 --- /dev/null +++ b/.github/workflows/labeler.yml @@ -0,0 +1,17 @@ +name: Pull Request Labeler + +on: [pull_request_target] + +permissions: + contents: read + pull-requests: write + +jobs: + label: + runs-on: ubuntu-latest + steps: + - uses: actions/labeler@v5 + with: + repo-token: "${{ secrets.STUDIOCMS_SERVICE_TOKEN }}" + configuration-path: .github/labeler.yml + sync-labels: true \ No newline at end of file diff --git a/.github/workflows/translation-changesets.yml b/.github/workflows/translation-changesets.yml new file mode 100644 index 000000000..f2470367e --- /dev/null +++ b/.github/workflows/translation-changesets.yml @@ -0,0 +1,46 @@ +name: Translation Changesets + +on: + pull_request: + types: [labeled, synchronize] + +permissions: + contents: write + +jobs: + build-translation-changesets: + runs-on: ubuntu-latest + if: contains(github.event.pull_request.labels.*.name, 'translations') && github.event.pull_request.user.login == 'studiocms-no-reply' + steps: + - name: Checkout Repo + uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4 + with: + ref: ${{ github.head_ref }} + token: ${{ secrets.STUDIOCMS_SERVICE_TOKEN }} + + - name: Setup pnpm (corepack enabled) + uses: pnpm/action-setup@v3 + + - name: Setup Node.js 20.x + uses: actions/setup-node@0a44ba7841725637a19e28fa30b79a866c81b0a6 # v4 + with: + node-version-file: '.node-version' + cache: 'pnpm' + + - name: Install Dependencies + run: pnpm ci:install + shell: bash + + - name: Create Translation Changesets + run: pnpm translations:changeset + env: + CI_PULL_REQUEST_NUMBER: ${{ github.event.pull_request.number }} + + - name: Commit changes + uses: stefanzweifel/git-auto-commit-action@8621497c8c39c72f3e2a999a26b4ca1b5058a842 # v5 + with: + commit_message: '[ci] changesets' + branch: ${{ github.head_ref }} + commit_user_name: astrolicious + commit_user_email: no-reply@studiocms.xyz + commit_author: StudioCMS \ No newline at end of file diff --git a/README.md b/README.md index 1e13cea5c..e879a1d59 100644 --- a/README.md +++ b/README.md @@ -17,9 +17,13 @@ To see how to get started, check out the [StudioCMS README](./packages/studiocms +## StudioCMS Dashboard i18n Status + +Translation status + ## Contributing -We welcome contributions from the community! Whether it's bug reports, feature requests, or code contributions, we appreciate your help in making this project better. To get started read our [Contributing Guide](https://docs.studiocms.xyz/start-here/contributing/) +We welcome contributions from the community! Whether it's bug reports, feature requests, or code contributions, we appreciate your help in making this project better. To get started read our [Contributing Guide](https://docs.studiocms.xyz/contributing/getting-started/) ## Chat with Us diff --git a/package.json b/package.json index 12cf9b2fc..69761c4ff 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,8 @@ "update:web": "pnpm --filter web up --latest", "update:docs": "pnpm --filter docs up --latest", "web:dev": "pnpm --filter web dev", - "docs:dev": "pnpm --filter docs dev" + "docs:dev": "pnpm --filter docs dev", + "translations:changeset": "tsm --require=./scripts/filter-warnings.cjs ./scripts/translation-changeset.ts" }, "devDependencies": { "@biomejs/biome": "1.9.3", @@ -35,6 +36,9 @@ "@changesets/cli": "2.27.9", "@changesets/config": "3.0.3", "@changesets/changelog-github": "^0.5.0", - "typescript": "catalog:" + "@changesets/write": "0.3.2", + "execa": "9.5.1", + "typescript": "catalog:", + "tsm": "2.3.0" } } diff --git a/packages/studiocms_auth/src/components/OAuthButtonStack.astro b/packages/studiocms_auth/src/components/OAuthButtonStack.astro index 731c4f205..bae54cdfc 100644 --- a/packages/studiocms_auth/src/components/OAuthButtonStack.astro +++ b/packages/studiocms_auth/src/components/OAuthButtonStack.astro @@ -1,12 +1,16 @@ --- +import { getLangFromUrl, useTranslations } from 'studiocms:i18n'; import { Divider } from '@studiocms/ui/components'; import OAuthButton from './OAuthButton.astro'; import { providerData, showOAuth } from './oAuthButtonProviders'; +const lang = getLangFromUrl(Astro.url); +const t = useTranslations(lang, '@studiocms/auth:oauth-stack'); + const shouldShowOAuth = showOAuth && providerData.some(({ enabled }) => enabled); --- { shouldShowOAuth && ( - or log in using + {t('or-login-with')}
{ providerData.map(({enabled, ...props}) => enabled && ) diff --git a/packages/studiocms_auth/src/components/StaticAuthCheck.astro b/packages/studiocms_auth/src/components/StaticAuthCheck.astro new file mode 100644 index 000000000..8452ea897 --- /dev/null +++ b/packages/studiocms_auth/src/components/StaticAuthCheck.astro @@ -0,0 +1,33 @@ +--- +import { getUserData } from 'studiocms:auth/lib/user'; +import { StudioCMSRoutes } from 'studiocms:helpers/routemap'; +import { getLangFromUrl, useTranslatedPath } from 'studiocms:i18n'; + +const { isLoggedIn } = await getUserData(Astro); +// Get the language and translations +const referer = Astro.request.headers.get('referer'); + +if (!referer) { + throw new Error('No referer found'); +} + +const lang = getLangFromUrl(new URL(referer)); +const translatePath = useTranslatedPath(lang); +const { + mainLinks: { dashboardIndex }, +} = StudioCMSRoutes; +--- + + + \ No newline at end of file diff --git a/packages/studiocms_auth/src/integration.ts b/packages/studiocms_auth/src/integration.ts index 9d2471ac6..a47d20298 100644 --- a/packages/studiocms_auth/src/integration.ts +++ b/packages/studiocms_auth/src/integration.ts @@ -83,6 +83,7 @@ export default defineIntegration({ }, experimental: { directRenderScript: true, + serverIslands: true, }, vite: { optimizeDeps: { @@ -112,6 +113,11 @@ export default defineIntegration({ entrypoint: resolve('./routes/api/login.ts'), enabled: usernameAndPasswordAPI, }, + { + pattern: 'logout', + entrypoint: resolve('./routes/api/logout.ts'), + enabled: dashboardEnabled && !options.dbStartPage, + }, { pattern: 'register', entrypoint: resolve('./routes/api/register.ts'), @@ -170,7 +176,7 @@ export default defineIntegration({ }, { pattern: 'logout/', - entrypoint: resolve('./routes/logout.ts'), + entrypoint: resolve('./routes/logout.astro'), enabled: dashboardEnabled && !options.dbStartPage, }, { diff --git a/packages/studiocms_auth/src/layouts/AuthLayout.astro b/packages/studiocms_auth/src/layouts/AuthLayout.astro index e378f984b..8d79a6927 100644 --- a/packages/studiocms_auth/src/layouts/AuthLayout.astro +++ b/packages/studiocms_auth/src/layouts/AuthLayout.astro @@ -21,10 +21,11 @@ const { interface Props { title: string; description: string; - lang?: string; + lang: string; + disableScreen?: boolean; } -const { title, description, lang = 'en' } = Astro.props; +const { title, description, lang, disableScreen } = Astro.props; // Get the site config const siteConfig = await db @@ -37,9 +38,10 @@ const siteConfig = await db const loginPageBackground = siteConfig?.loginPageBackground; const loginPageCustomImage = siteConfig?.loginPageCustomImage; -const fallbackImageSrc = loginPageBackground === 'custom' - ? loginPageCustomImage - : validImages.find((x) => x.name !== 'custom' && x.name === loginPageBackground)?.dark; // TODO: Adapt to theme +const fallbackImageSrc = + loginPageBackground === 'custom' + ? loginPageCustomImage + : validImages.find((x) => x.name !== 'custom' && x.name === loginPageBackground)?.dark; // TODO: Adapt to theme --- @@ -87,7 +89,7 @@ const fallbackImageSrc = loginPageBackground === 'custom' - + { !disableScreen && }