From ee0cbc7231dcccbc1a7d9db849bc5b37e6682dde Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Thu, 13 Feb 2025 20:55:47 +0100 Subject: [PATCH 01/11] refactor(editor): try repacing editorContent with normal child --- .../plugins/serlo-template-plugins/applet.tsx | 5 ++-- .../serlo-template-plugins/article.tsx | 4 ++-- .../serlo-template-plugins/common/common.tsx | 24 ------------------- .../plugins/serlo-template-plugins/course.tsx | 4 ++-- .../plugins/serlo-template-plugins/event.tsx | 5 ++-- .../exercise-group/text-exercise-group.tsx | 5 ++-- .../plugins/serlo-template-plugins/page.tsx | 12 +++++++--- .../serlo-template-plugins/taxonomy.tsx | 5 ++-- .../serlo-template-plugins/text-exercise.tsx | 5 ++-- .../plugins/serlo-template-plugins/user.tsx | 8 ++++--- .../plugins/serlo-template-plugins/video.tsx | 5 ++-- 11 files changed, 34 insertions(+), 48 deletions(-) diff --git a/packages/editor/src/plugins/serlo-template-plugins/applet.tsx b/packages/editor/src/plugins/serlo-template-plugins/applet.tsx index 1b39670a8b..64a97e7e5c 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/applet.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/applet.tsx @@ -1,4 +1,5 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, @@ -6,12 +7,12 @@ import { } from '@editor/plugin' import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent, serializedChild } from './common/common' +import { serializedChild } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const appletTypeState = object({ title: string(), - content: editorContent(), + content: child({ plugin: EditorPluginType.Rows }), url: serializedChild(EditorPluginType.Geogebra), }) diff --git a/packages/editor/src/plugins/serlo-template-plugins/article.tsx b/packages/editor/src/plugins/serlo-template-plugins/article.tsx index cb069ce034..a8948f9944 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/article.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/article.tsx @@ -1,4 +1,5 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, @@ -6,12 +7,11 @@ import { } from '@editor/plugin' import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const articleTypeState = object({ title: string(), - content: editorContent(EditorPluginType.Article), + content: child({ plugin: EditorPluginType.Article }), }) export type ArticleTypePluginState = typeof articleTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/common/common.tsx b/packages/editor/src/plugins/serlo-template-plugins/common/common.tsx index b1aa7dfebe..ac7c16bcf8 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/common/common.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/common/common.tsx @@ -4,30 +4,6 @@ import { StateTypeReturnType, child, } from '@editor/plugin' -import { EditorPluginType } from '@editor/types/editor-plugin-type' - -export function editorContent( - plugin: string = EditorPluginType.Rows -): StateType< - string, - StateTypeValueType>, - StateTypeReturnType> -> { - const originalChild = child({ plugin }) - return { - ...originalChild, - toStaticState(...args: Parameters) { - return JSON.stringify(originalChild.toStaticState(...args)) - }, - toStoreState( - serialized: string, - helpers: Parameters[1] - ) { - // eslint-disable-next-line @typescript-eslint/no-unsafe-argument - return originalChild.toStoreState(JSON.parse(serialized), helpers) - }, - } -} /** jup it's basically a string – and only used by type-applet */ export function serializedChild( diff --git a/packages/editor/src/plugins/serlo-template-plugins/course.tsx b/packages/editor/src/plugins/serlo-template-plugins/course.tsx index b15bf4751b..bc4d007256 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/course.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/course.tsx @@ -1,4 +1,5 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, @@ -7,12 +8,11 @@ import { import { CourseHeader } from '@editor/plugins/course/renderer/course-header' import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const courseTypeState = object({ title: string(), - content: editorContent(EditorPluginType.Course), + content: child({ plugin: EditorPluginType.Course }), }) export type CourseTypePluginState = typeof courseTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/event.tsx b/packages/editor/src/plugins/serlo-template-plugins/event.tsx index a15fc280c0..ad3b106c57 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/event.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/event.tsx @@ -1,16 +1,17 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, string, } from '@editor/plugin' +import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const eventTypeState = object({ title: string(), - content: editorContent(), + content: child({ plugin: EditorPluginType.Rows }), }) export type EventTypePluginState = typeof eventTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/exercise-group/text-exercise-group.tsx b/packages/editor/src/plugins/serlo-template-plugins/exercise-group/text-exercise-group.tsx index 429ed2a03e..077575b5d1 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/exercise-group/text-exercise-group.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/exercise-group/text-exercise-group.tsx @@ -1,4 +1,5 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, @@ -7,12 +8,10 @@ import { import { selectStaticDocument, useStore } from '@editor/store' import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from '../common/common' - // text-exercises also include interactive exercises, we keep the naming to avoid db-migration export const textExerciseGroupTypeState = object({ - content: editorContent(EditorPluginType.ExerciseGroup), + content: child({ plugin: EditorPluginType.ExerciseGroup }), }) export type TextExerciseGroupTypePluginState = typeof textExerciseGroupTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/page.tsx b/packages/editor/src/plugins/serlo-template-plugins/page.tsx index 80db4e6ff2..71ed4b60f7 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/page.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/page.tsx @@ -1,11 +1,17 @@ -import { EditorPlugin, EditorPluginProps, object, string } from '@editor/plugin' +import { + child, + EditorPlugin, + EditorPluginProps, + object, + string, +} from '@editor/plugin' +import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const pageTypeState = object({ title: string(), - content: editorContent(), + content: child({ plugin: EditorPluginType.Rows }), }) export type PageTypePluginState = typeof pageTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx b/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx index dbe6d7018a..ded07701ad 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx @@ -4,9 +4,10 @@ import { object, string, number, + child, } from '@editor/plugin' +import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const taxonomyTypeState = object({ @@ -15,7 +16,7 @@ export const taxonomyTypeState = object({ }), parent: number(), position: number(), - description: editorContent(), + description: child({ plugin: EditorPluginType.Rows }), }) export type TaxonomyTypePluginState = typeof taxonomyTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/text-exercise.tsx b/packages/editor/src/plugins/serlo-template-plugins/text-exercise.tsx index 56195202fb..9ff468e24a 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/text-exercise.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/text-exercise.tsx @@ -1,4 +1,5 @@ import { + child, object, type EditorPlugin, type EditorPluginProps, @@ -7,10 +8,8 @@ import { import { selectStaticDocument, useStore } from '@editor/store' import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' - export const textExerciseTypeState = object({ - content: editorContent(EditorPluginType.Exercise), + content: child({ plugin: EditorPluginType.Exercise }), }) export type TextExerciseTypePluginState = typeof textExerciseTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/user.tsx b/packages/editor/src/plugins/serlo-template-plugins/user.tsx index 44bb75f812..817186bf80 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/user.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/user.tsx @@ -1,12 +1,14 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, } from '@editor/plugin' +import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' - -export const userTypeState = object({ description: editorContent() }) +export const userTypeState = object({ + description: child({ plugin: EditorPluginType.Rows }), +}) export type UserTypePluginState = typeof userTypeState diff --git a/packages/editor/src/plugins/serlo-template-plugins/video.tsx b/packages/editor/src/plugins/serlo-template-plugins/video.tsx index e4260ac505..3e27e39f5f 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/video.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/video.tsx @@ -1,4 +1,5 @@ import { + child, type EditorPlugin, type EditorPluginProps, object, @@ -6,14 +7,14 @@ import { upload, } from '@editor/plugin' import { videoPlugin } from '@editor/plugins/video' +import { EditorPluginType } from '@editor/types/editor-plugin-type' -import { editorContent } from './common/common' import { EntityTitleInput } from './common/entity-title-input' export const videoTypeState = object({ content: upload(''), title: string(), - description: editorContent(), + description: child({ plugin: EditorPluginType.Rows }), }) export type VideoTypePluginState = typeof videoTypeState From 70c145312b5048df48053bffb08b9a57d14a733b Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Tue, 18 Feb 2025 23:25:52 +0100 Subject: [PATCH 02/11] fix(web): remove extra serialization step --- .../convert-editor-response-to-state.ts | 52 ++++++------------- 1 file changed, 16 insertions(+), 36 deletions(-) diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index ee3ed963d4..7fb82c6490 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -142,9 +142,7 @@ function unwrapEntityDescription(description: string | null | undefined) { ? R.omit(['document'], convertedDescription) : R.omit(['document'], createEmptyDocument('serlo-org')) - const entityDescription = serializeStaticDocument( - convertedDescription?.document - ) + const entityDescription = convertedDescription?.document return { editorMetadata, entityDescription } } @@ -163,32 +161,26 @@ export function unwrapEditorContent( | AnyEditorDocument | undefined - let templateContent if ( entityType !== 'Article' || editorContent?.plugin === EditorPluginType.Article ) { - templateContent = serializeStaticDocument(editorContent) - } else { - // currently still needed. See https://serlo.slack.com/archives/CEB781NCU/p1695977868948869 - templateContent = serializeStaticDocument({ - plugin: EditorPluginType.Article, - state: { - introduction: { plugin: EditorPluginType.ArticleIntroduction }, - content: editorContent, - exercises: [], - exerciseFolder: { id: '', title: '' }, - relatedContent: { - articles: [], - courses: [], - videos: [], - }, - sources: [], - }, - }) + return { editorMetadata, templateContent: editorContent } } - return { editorMetadata, templateContent } + // currently still needed. See https://serlo.slack.com/archives/CEB781NCU/p1695977868948869 + const articlePluginDocument = { + plugin: EditorPluginType.Article, + state: { + introduction: { plugin: EditorPluginType.ArticleIntroduction }, + content: editorContent, + exercises: [], + exerciseFolder: { id: '', title: '' }, + relatedContent: { articles: [], courses: [], videos: [] }, + sources: [], + }, + } + return { editorMetadata, templateContent: articlePluginDocument } } export function convertUserByDescription(description?: string | null) { @@ -199,9 +191,7 @@ export function convertUserByDescription(description?: string | null) { ...editorMetadata, document: { plugin: TemplatePluginType.User, - state: { - description: entityDescription, - }, + state: { description: entityDescription }, }, } } @@ -245,16 +235,6 @@ export function isError( return !!(result as ConvertResponseError).error } -function serializeStaticDocument(content?: AnyEditorDocument): string { - if (typeof content === 'string') return content - return JSON.stringify( - content ?? { - plugin: EditorPluginType.Rows, - state: [{ plugin: EditorPluginType.Text, state: undefined }], - } - ) -} - function parseEditorData( content: SerializedStaticState ): StorageFormat | undefined { From 643f306aa6ca2093b89a337b45318993d44718ba Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Tue, 18 Feb 2025 23:26:32 +0100 Subject: [PATCH 03/11] refactor(web): refactor convertEditorStateToSetEntityMutationData and remove extra parse --- ...ditor-state-to-set-entity-mutation-data.ts | 34 ++++++++----------- 1 file changed, 14 insertions(+), 20 deletions(-) diff --git a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts index 830739e87f..6ae0ad50bb 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts @@ -3,31 +3,25 @@ import { TemplatePluginType, type StorageFormat } from '@editor/package' import type { AbstractSerializedState } from './convert-editor-response-to-state' import type { SetEntityMutationData } from '@/mutations/use-set-entity-mutation/types' +const typesWithDescription = [ + TemplatePluginType.Taxonomy, + TemplatePluginType.Video, + TemplatePluginType.User, +] + export function convertEditorStateToSetEntityMutationData( editorState: StorageFormat ): SetEntityMutationData { const editorDocumentState = editorState.document .state as AbstractSerializedState - if ( - editorState.document.plugin === TemplatePluginType.Taxonomy || - editorState.document.plugin === TemplatePluginType.Video || - editorState.document.plugin === TemplatePluginType.User - ) { - return { - ...editorDocumentState, - description: JSON.stringify({ - ...editorState, - document: JSON.parse(editorDocumentState.description || '') as unknown, - }), - } - } + const document = typesWithDescription.includes( + editorState.document.plugin as TemplatePluginType + ) + ? editorDocumentState.description + : editorDocumentState.content + + const content = JSON.stringify({ ...editorState, document }) - return { - ...editorDocumentState, - content: JSON.stringify({ - ...editorState, - document: JSON.parse(editorDocumentState.content || '') as unknown, - }), - } + return { ...editorDocumentState, content } } From cb9f5f6191495bac8358e25042fc0577491a27ac Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Tue, 18 Feb 2025 23:37:40 +0100 Subject: [PATCH 04/11] fix(web): use stringified version to save user desc --- .../components/user/profile-description-editor.tsx | 11 ++++------- .../convert-editor-response-to-state.ts | 4 +--- 2 files changed, 5 insertions(+), 10 deletions(-) diff --git a/apps/web/src/components/user/profile-description-editor.tsx b/apps/web/src/components/user/profile-description-editor.tsx index dde2644f71..e39dda4ebb 100644 --- a/apps/web/src/components/user/profile-description-editor.tsx +++ b/apps/web/src/components/user/profile-description-editor.tsx @@ -16,7 +16,7 @@ export function ProfileDescriptionEditor({ const handleSave = async (data: unknown) => { const success = await setDescription({ - description: (data as { description: string }).description, + description: (data as { content: string }).content, }) if (!success) { // eslint-disable-next-line no-console @@ -25,14 +25,11 @@ export function ProfileDescriptionEditor({ } return revalidatePath(`/user/profile/${username}`) } - const initialState = convertUserByDescription(rawDescription) return ( - <> -
- -
- +
+ +
) } diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index 7fb82c6490..3f34334a47 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -62,9 +62,7 @@ export function convertEditorResponseToState( message: `error while converting: ${JSON.stringify(stack)}`, }) - return { - error: 'failure', - } + return { error: 'failure' } } function convertAbstractEntity( From 3715d47f3b908c459dc46f251681b9e0fbfa71d2 Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Tue, 18 Feb 2025 23:52:36 +0100 Subject: [PATCH 05/11] fix(web): fallback to empty rows when user desc is undefined --- .../convert-editor-response-to-state.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index 3f34334a47..3b8e70b972 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -126,7 +126,7 @@ export function convertEditorResponseToState( term: { name: uuid.name, }, - description: entityDescription, + description: entityDescription ?? { plugin: EditorPluginType.Rows }, }, }, } From 31cb3ed4f8540000b28c12a7d45f76b743645d60 Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Tue, 18 Feb 2025 23:52:57 +0100 Subject: [PATCH 06/11] fix(web): use content string as user description --- apps/web/src/mutations/use-set-entity-mutation/types.ts | 1 + .../src/mutations/use-taxonomy-create-or-update-mutation.ts | 4 ++-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/apps/web/src/mutations/use-set-entity-mutation/types.ts b/apps/web/src/mutations/use-set-entity-mutation/types.ts index e77633aea8..5912563e46 100644 --- a/apps/web/src/mutations/use-set-entity-mutation/types.ts +++ b/apps/web/src/mutations/use-set-entity-mutation/types.ts @@ -13,6 +13,7 @@ export type TaxonomyCreateOrUpdateMutationData = Pick< > & { __typename?: 'TaxonomyTerm' parent?: number + content: string } export interface SetEntityMutationRunnerData { diff --git a/apps/web/src/mutations/use-taxonomy-create-or-update-mutation.ts b/apps/web/src/mutations/use-taxonomy-create-or-update-mutation.ts index 898e197af2..de65d1c8a4 100644 --- a/apps/web/src/mutations/use-taxonomy-create-or-update-mutation.ts +++ b/apps/web/src/mutations/use-taxonomy-create-or-update-mutation.ts @@ -55,8 +55,8 @@ export function useTaxonomyCreateOrUpdateMutation() { name: getRequiredString(mutationStrings, 'name', data.term.name), description: getRequiredString( mutationStrings, - 'description', - data.description + 'content', + data.content ), } From a267c73d642cd73631664dc1cf9feba4f6e127c6 Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Wed, 19 Feb 2025 00:14:52 +0100 Subject: [PATCH 07/11] refactor(template-video): finally use `url` to store url instead of `content` --- .../use-set-entity-mutation.ts | 15 +++++++++------ .../convert-editor-response-to-state.ts | 1 - .../src/plugins/serlo-template-plugins/video.tsx | 9 +++------ 3 files changed, 12 insertions(+), 13 deletions(-) diff --git a/apps/web/src/mutations/use-set-entity-mutation/use-set-entity-mutation.ts b/apps/web/src/mutations/use-set-entity-mutation/use-set-entity-mutation.ts index beda274da8..698e024909 100644 --- a/apps/web/src/mutations/use-set-entity-mutation/use-set-entity-mutation.ts +++ b/apps/web/src/mutations/use-set-entity-mutation/use-set-entity-mutation.ts @@ -59,7 +59,6 @@ export function useSetEntityMutation() { return false } const additionalInput = getAdditionalInputData(mutationStrings, data) - input = { entityId, ...genericInput, @@ -148,7 +147,13 @@ function getAdditionalInputData( mutationStrings: LoggedInData['strings']['mutations'], data: SetEntityMutationData ) { - const { title, url, content, description } = data + if ( + data.__typename === UuidType.Exercise || + data.__typename === UuidType.ExerciseGroup + ) { + return {} + } + const { title, url, content } = data switch (data.__typename) { case UuidType.Course: case UuidType.Article: @@ -157,16 +162,14 @@ function getAdditionalInputData( return { title: getRequiredString(mutationStrings, 'title', title), } - case UuidType.Exercise: case UuidType.ExerciseGroup: return {} case UuidType.Video: return { title: getRequiredString(mutationStrings, 'title', title), - // url is stored in content for some reason - url: getRequiredString(mutationStrings, 'url', content), - content: getRequiredString(mutationStrings, 'content', description), + url: getRequiredString(mutationStrings, 'url', url), + content: getRequiredString(mutationStrings, 'content', content), } case UuidType.Applet: return { diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index 3b8e70b972..f2112d7658 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -83,7 +83,6 @@ export function convertEditorResponseToState( plugin: TemplatePluginType.Video, state: { ...entityFields, - content: url ? url : templateContent, description: templateContent, ...(url ? { url } : {}), }, diff --git a/packages/editor/src/plugins/serlo-template-plugins/video.tsx b/packages/editor/src/plugins/serlo-template-plugins/video.tsx index 3e27e39f5f..3aad3bafd6 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/video.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/video.tsx @@ -12,7 +12,7 @@ import { EditorPluginType } from '@editor/types/editor-plugin-type' import { EntityTitleInput } from './common/entity-title-input' export const videoTypeState = object({ - content: upload(''), + url: upload(''), title: string(), description: child({ plugin: EditorPluginType.Rows }), }) @@ -26,17 +26,14 @@ export const videoTypePlugin: EditorPlugin = { } function VideoTypeEditor(props: EditorPluginProps) { - const { title, content, description } = props.state + const { title, url, description } = props.state return ( <>
- + {description.render()}
From 4aecb623f06e82760dd32f1af2e82820111a9a3b Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Wed, 19 Feb 2025 00:39:44 +0100 Subject: [PATCH 08/11] refactor(template-video): simplify by using `content` instead of `description` --- .../convert-editor-response-to-state.ts | 14 -------------- ...ert-editor-state-to-set-entity-mutation-data.ts | 1 - .../src/plugins/serlo-template-plugins/video.tsx | 6 +++--- 3 files changed, 3 insertions(+), 18 deletions(-) diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index f2112d7658..f19ef9e854 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -76,20 +76,6 @@ export function convertEditorResponseToState( content ) - if (uuid.__typename === UuidType.Video) { - return { - ...editorMetadata, - document: { - plugin: TemplatePluginType.Video, - state: { - ...entityFields, - description: templateContent, - ...(url ? { url } : {}), - }, - }, - } - } - return { ...editorMetadata, document: { diff --git a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts index 6ae0ad50bb..383849527d 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts @@ -5,7 +5,6 @@ import type { SetEntityMutationData } from '@/mutations/use-set-entity-mutation/ const typesWithDescription = [ TemplatePluginType.Taxonomy, - TemplatePluginType.Video, TemplatePluginType.User, ] diff --git a/packages/editor/src/plugins/serlo-template-plugins/video.tsx b/packages/editor/src/plugins/serlo-template-plugins/video.tsx index 3aad3bafd6..09f49692a6 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/video.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/video.tsx @@ -14,7 +14,7 @@ import { EntityTitleInput } from './common/entity-title-input' export const videoTypeState = object({ url: upload(''), title: string(), - description: child({ plugin: EditorPluginType.Rows }), + content: child({ plugin: EditorPluginType.Rows }), }) export type VideoTypePluginState = typeof videoTypeState @@ -26,7 +26,7 @@ export const videoTypePlugin: EditorPlugin = { } function VideoTypeEditor(props: EditorPluginProps) { - const { title, url, description } = props.state + const { title, url, content } = props.state return ( <> @@ -34,7 +34,7 @@ function VideoTypeEditor(props: EditorPluginProps) {
- {description.render()} + {content.render()}
) From 41c2196d3bef4cac738178d8c025227d9eb1c0f4 Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Wed, 19 Feb 2025 00:50:40 +0100 Subject: [PATCH 09/11] refactor(template-taxonomy): simplify by using `content` instead of `description` --- .../convert-editor-response-to-state.ts | 7 ++++--- .../convert-editor-state-to-set-entity-mutation-data.ts | 5 +---- .../editor/src/plugins/serlo-template-plugins/taxonomy.tsx | 6 +++--- 3 files changed, 8 insertions(+), 10 deletions(-) diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index f19ef9e854..fbb8584c25 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -96,8 +96,9 @@ export function convertEditorResponseToState( ): StorageFormat { stack.push({ id: uuid.id, type: entityType }) - const { editorMetadata, entityDescription } = unwrapEntityDescription( - uuid.description + const { editorMetadata, templateContent } = unwrapEditorContent( + UuidType.TaxonomyTerm, + uuid.description ?? undefined ) return { @@ -111,7 +112,7 @@ export function convertEditorResponseToState( term: { name: uuid.name, }, - description: entityDescription ?? { plugin: EditorPluginType.Rows }, + content: templateContent ?? { plugin: EditorPluginType.Rows }, }, }, } diff --git a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts index 383849527d..aff640cbdd 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts @@ -3,10 +3,7 @@ import { TemplatePluginType, type StorageFormat } from '@editor/package' import type { AbstractSerializedState } from './convert-editor-response-to-state' import type { SetEntityMutationData } from '@/mutations/use-set-entity-mutation/types' -const typesWithDescription = [ - TemplatePluginType.Taxonomy, - TemplatePluginType.User, -] +const typesWithDescription = [TemplatePluginType.User] export function convertEditorStateToSetEntityMutationData( editorState: StorageFormat diff --git a/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx b/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx index ded07701ad..842d320263 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/taxonomy.tsx @@ -16,7 +16,7 @@ export const taxonomyTypeState = object({ }), parent: number(), position: number(), - description: child({ plugin: EditorPluginType.Rows }), + content: child({ plugin: EditorPluginType.Rows }), }) export type TaxonomyTypePluginState = typeof taxonomyTypeState @@ -28,7 +28,7 @@ export const taxonomyTypePlugin: EditorPlugin = { } function TaxonomyTypeEditor(props: EditorPluginProps) { - const { term, description } = props.state + const { term, content } = props.state return ( <> @@ -36,7 +36,7 @@ function TaxonomyTypeEditor(props: EditorPluginProps) { - {description.render()} + {content.render()} ) } From c86c81af5a0406180e52b64f488ceb9b48bea94e Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Wed, 19 Feb 2025 00:59:38 +0100 Subject: [PATCH 10/11] fix(template-taxonomy): also adapt new taxonomy code --- .../src/pages/taxonomy/term/create/[parent_id]/[id].tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/apps/web/src/pages/taxonomy/term/create/[parent_id]/[id].tsx b/apps/web/src/pages/taxonomy/term/create/[parent_id]/[id].tsx index e0f25e5cd9..a9bae48bc3 100644 --- a/apps/web/src/pages/taxonomy/term/create/[parent_id]/[id].tsx +++ b/apps/web/src/pages/taxonomy/term/create/[parent_id]/[id].tsx @@ -1,4 +1,8 @@ -import { createEmptyDocument, TemplatePluginType } from '@editor/package' +import { + createEmptyDocument, + EditorPluginType, + TemplatePluginType, +} from '@editor/package' import { GetServerSideProps } from 'next' import { FrontendClientBase } from '@/components/frontend-client-base/frontend-client-base' @@ -30,7 +34,7 @@ export default renderedPageNoHooks(({ parent }) => { plugin: TemplatePluginType.Taxonomy, state: { term: { name: '' }, - description: '{"plugin":"rows"}', + content: { plugin: EditorPluginType.Rows }, }, }, }} From 858b4fe45b0ee18e0a4871ef377fd4d7ddd9dbaa Mon Sep 17 00:00:00 2001 From: Botho <1258870+elbotho@users.noreply.github.com> Date: Wed, 19 Feb 2025 01:31:30 +0100 Subject: [PATCH 11/11] refactor(template-user): simplify by using `content` instead of `description` & simplify types --- .../use-set-entity-mutation/types.ts | 16 +++---- .../convert-editor-response-to-state.ts | 45 ++++--------------- ...ditor-state-to-set-entity-mutation-data.ts | 24 +++++----- .../use-handle-save.ts | 4 +- .../plugins/serlo-template-plugins/user.tsx | 4 +- 5 files changed, 29 insertions(+), 64 deletions(-) diff --git a/apps/web/src/mutations/use-set-entity-mutation/types.ts b/apps/web/src/mutations/use-set-entity-mutation/types.ts index 5912563e46..c30ef72e04 100644 --- a/apps/web/src/mutations/use-set-entity-mutation/types.ts +++ b/apps/web/src/mutations/use-set-entity-mutation/types.ts @@ -1,17 +1,15 @@ -import type { - AbstractSerializedState, - TaxonomySerializedState, -} from '@/serlo-editor-integration/convert-editor-response-to-state' +import type { SerializedAbstractTemplatePluginDocument } from '@/serlo-editor-integration/convert-editor-response-to-state' -export type SetEntityMutationData = AbstractSerializedState & { +export type SetEntityMutationData = SerializedAbstractTemplatePluginDocument & { changes?: string } -export type TaxonomyCreateOrUpdateMutationData = Pick< - TaxonomySerializedState, - 'term' | 'description' -> & { +export interface TaxonomyCreateOrUpdateMutationData { __typename?: 'TaxonomyTerm' + term: { + name: string + } + description: string parent?: number content: string } diff --git a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts index fbb8584c25..c71bbf9da4 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-response-to-state.ts @@ -119,18 +119,6 @@ export function convertEditorResponseToState( } } -function unwrapEntityDescription(description: string | null | undefined) { - const convertedDescription = parseEditorData(description ?? undefined) - - const editorMetadata = convertedDescription - ? R.omit(['document'], convertedDescription) - : R.omit(['document'], createEmptyDocument('serlo-org')) - - const entityDescription = convertedDescription?.document - - return { editorMetadata, entityDescription } -} - export function unwrapEditorContent( entityType: MainUuidType['__typename'], content?: string @@ -167,43 +155,26 @@ export function unwrapEditorContent( return { editorMetadata, templateContent: articlePluginDocument } } -export function convertUserByDescription(description?: string | null) { - const { editorMetadata, entityDescription } = - unwrapEntityDescription(description) +export function convertUserByDescription(content?: string | null) { + const { editorMetadata, templateContent } = unwrapEditorContent( + UuidType.User, + content ?? undefined + ) return { ...editorMetadata, document: { plugin: TemplatePluginType.User, - state: { description: entityDescription }, + state: { content: templateContent }, }, } } -export interface AbstractSerializedState { +export interface SerializedAbstractTemplatePluginDocument { __typename?: UuidType[number] - title?: string content: SerializedStaticState - reasoning?: SerializedStaticState - description: SerializedStaticState + title?: string url?: string - cohesive?: string -} - -export interface TaxonomySerializedState { - __typename?: UuidType.TaxonomyTerm - term: { - name: string - } - description: SerializedStaticState - taxonomy: number - parent: number - position: number -} - -export interface UserSerializedState { - __typename?: UuidType.User - description: SerializedStaticState } export type ConvertResponseError = diff --git a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts index aff640cbdd..cd3b48bec5 100644 --- a/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts +++ b/apps/web/src/serlo-editor-integration/convert-editor-state-to-set-entity-mutation-data.ts @@ -1,23 +1,19 @@ -import { TemplatePluginType, type StorageFormat } from '@editor/package' +import { type StorageFormat } from '@editor/package' -import type { AbstractSerializedState } from './convert-editor-response-to-state' +import type { SerializedAbstractTemplatePluginDocument } from './convert-editor-response-to-state' import type { SetEntityMutationData } from '@/mutations/use-set-entity-mutation/types' -const typesWithDescription = [TemplatePluginType.User] - export function convertEditorStateToSetEntityMutationData( editorState: StorageFormat ): SetEntityMutationData { const editorDocumentState = editorState.document - .state as AbstractSerializedState - - const document = typesWithDescription.includes( - editorState.document.plugin as TemplatePluginType - ) - ? editorDocumentState.description - : editorDocumentState.content - - const content = JSON.stringify({ ...editorState, document }) + .state as SerializedAbstractTemplatePluginDocument - return { ...editorDocumentState, content } + return { + ...editorDocumentState, + content: JSON.stringify({ + ...editorState, + document: editorDocumentState.content, + }), + } } diff --git a/apps/web/src/serlo-editor-integration/use-handle-save.ts b/apps/web/src/serlo-editor-integration/use-handle-save.ts index 4bbd55b665..4279c97a3f 100644 --- a/apps/web/src/serlo-editor-integration/use-handle-save.ts +++ b/apps/web/src/serlo-editor-integration/use-handle-save.ts @@ -1,11 +1,11 @@ import { useEffect, useState } from 'react' -import { type AbstractSerializedState } from './convert-editor-response-to-state' +import { type SerializedAbstractTemplatePluginDocument } from './convert-editor-response-to-state' import type { SerloEditorProps } from './serlo-editor' export function useHandleSave( visible: boolean, - editorDocumentState: AbstractSerializedState, + editorDocumentState: SerializedAbstractTemplatePluginDocument, onSave: SerloEditorProps['onSave'] ) { const [pending, setPending] = useState(false) diff --git a/packages/editor/src/plugins/serlo-template-plugins/user.tsx b/packages/editor/src/plugins/serlo-template-plugins/user.tsx index 817186bf80..3cc1e4ddce 100644 --- a/packages/editor/src/plugins/serlo-template-plugins/user.tsx +++ b/packages/editor/src/plugins/serlo-template-plugins/user.tsx @@ -7,7 +7,7 @@ import { import { EditorPluginType } from '@editor/types/editor-plugin-type' export const userTypeState = object({ - description: child({ plugin: EditorPluginType.Rows }), + content: child({ plugin: EditorPluginType.Rows }), }) export type UserTypePluginState = typeof userTypeState @@ -19,5 +19,5 @@ export const userTypePlugin: EditorPlugin = { } function UserTypeEditor({ state }: EditorPluginProps) { - return <>{state.description.render()} + return state.content.render() }