From 971720044b01b39d709957193165fbb1520ca9f9 Mon Sep 17 00:00:00 2001 From: Joakim Repomaa Date: Thu, 8 Jun 2023 19:57:36 +0200 Subject: [PATCH 1/5] fix: I18n improvements (#836) --- .../entry-editor/EditorInterface.tsx | 92 +++++++++++++------ .../editor-control-pane/EditorControlPane.tsx | 3 + .../editor-control-pane/LocaleDropdown.tsx | 4 +- 3 files changed, 68 insertions(+), 31 deletions(-) diff --git a/packages/core/src/components/entry-editor/EditorInterface.tsx b/packages/core/src/components/entry-editor/EditorInterface.tsx index 1c5ffd11..a6eca6ce 100644 --- a/packages/core/src/components/entry-editor/EditorInterface.tsx +++ b/packages/core/src/components/entry-editor/EditorInterface.tsx @@ -96,14 +96,23 @@ const EditorInterface = ({ slug, }: TranslatedProps) => { const { locales, defaultLocale } = useMemo(() => getI18nInfo(collection), [collection]) ?? {}; - const [selectedLocale, setSelectedLocale] = useState(locales?.[1] ?? 'en'); + const translatedLocales = useMemo( + () => locales?.filter(locale => locale !== defaultLocale) ?? [], + [locales, defaultLocale], + ); const [previewActive, setPreviewActive] = useState( localStorage.getItem(PREVIEW_VISIBLE) !== 'false', ); + const i18nEnabled = locales && locales.length > 0; + const [i18nActive, setI18nActive] = useState( - Boolean(localStorage.getItem(I18N_VISIBLE) !== 'false' && locales && locales.length > 0), + Boolean(localStorage.getItem(I18N_VISIBLE) !== 'false' && i18nEnabled), + ); + + const [selectedLocale, setSelectedLocale] = useState( + (i18nActive ? translatedLocales?.[0] : defaultLocale) ?? 'en', ); useEffect(() => { @@ -132,8 +141,11 @@ const EditorInterface = ({ const handleToggleI18n = useCallback(() => { const newI18nActive = !i18nActive; setI18nActive(newI18nActive); + setSelectedLocale(selectedLocale => + newI18nActive && selectedLocale === defaultLocale ? translatedLocales?.[0] : selectedLocale, + ); localStorage.setItem(I18N_VISIBLE, `${newI18nActive}`); - }, [i18nActive]); + }, [i18nActive, setSelectedLocale, translatedLocales, defaultLocale]); const handleLocaleChange = useCallback((locale: string) => { setSelectedLocale(locale); @@ -169,34 +181,53 @@ const EditorInterface = ({ const collectHasI18n = hasI18n(collection); - const editor = ( -
( +
- -
+ (finalPreviewActive || i18nActive) && + ` + overflow-y-auto + styled-scrollbars + h-main + `, + )} + > + +
+ ), + [ + collection, + defaultLocale, + selectedLocale, + entry, + fields, + fieldsErrors, + finalPreviewActive, + i18nActive, + i18nEnabled, + handleLocaleChange, + slug, + submitted, + t, + ], ); const editorLocale = useMemo( @@ -219,6 +250,7 @@ const EditorInterface = ({ onLocaleChange={handleLocaleChange} submitted={submitted} canChangeLocale + context="i18nSplit" hideBorder t={t} /> @@ -228,7 +260,7 @@ const EditorInterface = ({ ); const previewEntry = collectHasI18n - ? getPreviewEntry(entry, selectedLocale[0], defaultLocale) + ? getPreviewEntry(entry, selectedLocale, defaultLocale) : entry; const editorWithPreview = ( diff --git a/packages/core/src/components/entry-editor/editor-control-pane/EditorControlPane.tsx b/packages/core/src/components/entry-editor/editor-control-pane/EditorControlPane.tsx index 990e978b..afd589cb 100644 --- a/packages/core/src/components/entry-editor/editor-control-pane/EditorControlPane.tsx +++ b/packages/core/src/components/entry-editor/editor-control-pane/EditorControlPane.tsx @@ -30,6 +30,7 @@ export interface EditorControlPaneProps { hideBorder: boolean; slug?: string; onLocaleChange?: (locale: string) => void; + context?: 'default' | 'i18nSplit'; } const EditorControlPane = ({ @@ -43,6 +44,7 @@ const EditorControlPane = ({ hideBorder, slug, onLocaleChange, + context = 'default', t, }: TranslatedProps) => { const pathField = useMemo( @@ -117,6 +119,7 @@ const EditorControlPane = ({ })} canChangeLocale={canChangeLocale} onLocaleChange={onLocaleChange} + excludeLocales={context === 'i18nSplit' ? [i18n.defaultLocale] : []} /> ) : null} diff --git a/packages/core/src/components/entry-editor/editor-control-pane/LocaleDropdown.tsx b/packages/core/src/components/entry-editor/editor-control-pane/LocaleDropdown.tsx index 14984ac5..c54f2531 100644 --- a/packages/core/src/components/entry-editor/editor-control-pane/LocaleDropdown.tsx +++ b/packages/core/src/components/entry-editor/editor-control-pane/LocaleDropdown.tsx @@ -10,6 +10,7 @@ interface LocaleDropdownProps { dropdownText: string; canChangeLocale: boolean; onLocaleChange?: (locale: string) => void; + excludeLocales?: string[]; } const LocaleDropdown = ({ @@ -18,6 +19,7 @@ const LocaleDropdown = ({ dropdownText, canChangeLocale, onLocaleChange, + excludeLocales = [defaultLocale], }: LocaleDropdownProps) => { if (!canChangeLocale) { return ( @@ -39,7 +41,7 @@ const LocaleDropdown = ({ {locales - .filter(locale => locale !== defaultLocale) + .filter(locale => !excludeLocales.includes(locale)) .map(locale => ( onLocaleChange?.(locale)}> {locale} From 0c592f69438950e84d98a8b392f9c8f2573e1e90 Mon Sep 17 00:00:00 2001 From: Daniel Lautzenheiser Date: Tue, 13 Jun 2023 11:23:33 -0400 Subject: [PATCH 2/5] fix: contain custom logo instead of cover and crop --- packages/core/src/components/login/Login.tsx | 2 +- packages/core/src/components/navbar/Navbar.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/core/src/components/login/Login.tsx b/packages/core/src/components/login/Login.tsx index ab66e7bc..e489b663 100644 --- a/packages/core/src/components/login/Login.tsx +++ b/packages/core/src/components/login/Login.tsx @@ -34,7 +34,7 @@ const Login = ({
{config?.logo_url ? (
) : ( diff --git a/packages/core/src/components/navbar/Navbar.tsx b/packages/core/src/components/navbar/Navbar.tsx index 37f991fc..484dffca 100644 --- a/packages/core/src/components/navbar/Navbar.tsx +++ b/packages/core/src/components/navbar/Navbar.tsx @@ -57,7 +57,7 @@ const Navbar = ({
{config?.logo_url ? (
) : ( From ad0545dd7aacc465924ffb1cf5c35c948159bfd6 Mon Sep 17 00:00:00 2001 From: Daniel Lautzenheiser Date: Tue, 13 Jun 2023 15:45:26 -0400 Subject: [PATCH 3/5] fix: draft folder support (#840) --- packages/core/src/backend.ts | 87 ++++++++++++------- packages/core/src/lib/util/media.util.ts | 9 +- packages/core/src/reducers/mediaLibrary.ts | 11 ++- .../widgets/markdown/plate/PlateEditor.tsx | 1 + 4 files changed, 73 insertions(+), 35 deletions(-) diff --git a/packages/core/src/backend.ts b/packages/core/src/backend.ts index 813ea934..618cb7df 100644 --- a/packages/core/src/backend.ts +++ b/packages/core/src/backend.ts @@ -4,6 +4,7 @@ import flatten from 'lodash/flatten'; import get from 'lodash/get'; import isError from 'lodash/isError'; import uniq from 'lodash/uniq'; +import { dirname } from 'path'; import { resolveFormat } from './formats/formats'; import { commitMessageFormatter, slugFormatter } from './lib/formatters'; @@ -40,12 +41,9 @@ import { selectMediaFolders, } from './lib/util/collection.util'; import filterEntries from './lib/util/filter.util'; -import { - DRAFT_MEDIA_FILES, - selectMediaFilePath, - selectMediaFilePublicPath, -} from './lib/util/media.util'; +import { DRAFT_MEDIA_FILES, selectMediaFilePublicPath } from './lib/util/media.util'; import { selectCustomPath, slugFromCustomPath } from './lib/util/nested.util'; +import { isNullish } from './lib/util/null.util'; import { set } from './lib/util/object.util'; import { dateParsers, expandPath, extractTemplateVars } from './lib/widgets/stringTemplate'; import createEntry from './valueObjects/createEntry'; @@ -63,46 +61,70 @@ import type { DisplayURL, Entry, EntryData, - EntryDraft, EventData, FilterRule, ImplementationEntry, MediaField, + ObjectValue, PersistArgs, SearchQueryResponse, SearchResponse, UnknownField, User, + ValueOrNestedValue, } from './interface'; import type { AsyncLock } from './lib/util'; import type { RootState } from './store'; import type AssetProxy from './valueObjects/AssetProxy'; -function updateAssetProxies( - assetProxies: AssetProxy[], - config: Config, - collection: Collection, - entryDraft: EntryDraft, - path: string, -) { - assetProxies.map(asset => { - // update media files path based on entry path - const oldPath = asset.path; - entryDraft.entry.path = path; +function updatePath(entryPath: string, assetPath: string): string | null { + const pathDir = dirname(entryPath); - const folderPath = joinUrlPath( - collection && 'folder' in collection ? collection.folder : '', - DRAFT_MEDIA_FILES, - ); + const pathParts = assetPath.split(DRAFT_MEDIA_FILES); + const restOfPath = pathParts.length > 1 ? pathParts[1] : null; + if (restOfPath === null) { + return null; + } - const newPath = selectMediaFilePath( - config, - collection, - entryDraft.entry, - oldPath.replace(folderPath, ''), - asset.field, - ); - asset.path = newPath; + return joinUrlPath(pathDir, restOfPath).replace(/\/\//g, ''); +} + +function updateAssetFields(data: ValueOrNestedValue, path: string): ValueOrNestedValue { + if ( + isNullish(data) || + typeof data === 'number' || + typeof data === 'boolean' || + data instanceof Date + ) { + return data; + } + + if (Array.isArray(data)) { + return data.map(child => updateAssetFields(child, path)); + } + + if (typeof data === 'object') { + return Object.keys(data).reduce((acc, key) => { + acc[key] = updateAssetFields(data[key], path); + + return acc; + }, {} as ObjectValue); + } + + const newPath = updatePath(path, data); + if (!newPath) { + return data; + } + + return newPath; +} + +function updateAssetProxies(assetProxies: AssetProxy[], path: string) { + assetProxies.forEach(asset => { + const newPath = updatePath(path, asset.path); + if (newPath) { + asset.path = newPath; + } }); } @@ -865,13 +887,16 @@ export class Backend = ({ ...editableProps, onFocus, onBlur, + className: 'outline-none', }} >
From c600f59b77a59be7ed3c9ee7a7b7b3d6fc3bcb82 Mon Sep 17 00:00:00 2001 From: Daniel Lautzenheiser Date: Tue, 13 Jun 2023 15:46:53 -0400 Subject: [PATCH 4/5] docs: add release 2.5.0 --- packages/docs/content/releases.json | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/docs/content/releases.json b/packages/docs/content/releases.json index 52ec77fb..22945c6a 100644 --- a/packages/docs/content/releases.json +++ b/packages/docs/content/releases.json @@ -1,5 +1,11 @@ { "releases": [ + { + "date": "2023-06-13T10:00:00.000Z", + "version": "v2.5.0", + "type": "minor", + "description": "Switch i18n locales while in preview mode" + }, { "date": "2023-05-29T10:00:00.000Z", "version": "v2.4.4", From 7b4a8ac376a28d3fca6087fb10959da58443a839 Mon Sep 17 00:00:00 2001 From: Daniel Lautzenheiser Date: Tue, 13 Jun 2023 15:47:07 -0400 Subject: [PATCH 5/5] v2.5.0 --- lerna.json | 2 +- packages/app/package.json | 4 ++-- packages/core/package.json | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/lerna.json b/lerna.json index 55618d36..d2ec24ba 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { "$schema": "node_modules/lerna/schemas/lerna-schema.json", "useWorkspaces": true, - "version": "2.4.4" + "version": "2.5.0" } diff --git a/packages/app/package.json b/packages/app/package.json index 322850aa..f2a37be6 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -1,6 +1,6 @@ { "name": "@staticcms/app", - "version": "2.4.4", + "version": "2.5.0", "license": "MIT", "description": "Static CMS application.", "repository": "https://github.com/StaticJsCMS/static-cms", @@ -40,7 +40,7 @@ "@babel/eslint-parser": "7.21.3", "@babel/runtime": "7.21.0", "@emotion/babel-preset-css-prop": "11.10.0", - "@staticcms/core": "^2.4.4", + "@staticcms/core": "^2.5.0", "buffer": "6.0.3", "react": "18.2.0", "react-dom": "18.2.0", diff --git a/packages/core/package.json b/packages/core/package.json index affe2a3f..4194368c 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@staticcms/core", - "version": "2.4.4", + "version": "2.5.0", "license": "MIT", "description": "Static CMS core application.", "repository": "https://github.com/StaticJsCMS/static-cms",