From e192e6215df016d3e1f468c3dbfb7de945cad2e8 Mon Sep 17 00:00:00 2001 From: kudlajz Date: Thu, 8 Aug 2024 14:26:32 +0200 Subject: [PATCH 1/2] Remove fallback when changing the type instead of using an effect --- .../src/extensions/variables/VariableMenu.tsx | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/packages/slate-editor/src/extensions/variables/VariableMenu.tsx b/packages/slate-editor/src/extensions/variables/VariableMenu.tsx index e131e7269..73e9a5965 100644 --- a/packages/slate-editor/src/extensions/variables/VariableMenu.tsx +++ b/packages/slate-editor/src/extensions/variables/VariableMenu.tsx @@ -1,5 +1,5 @@ import type { VariableNode } from '@prezly/slate-types'; -import React, { useEffect, useState } from 'react'; +import React, { useState } from 'react'; import { useSlateStatic } from 'slate-react'; import { Button, Input, Menu as BaseMenu, Toolbox, VStack, TooltipV2 } from '#components'; @@ -36,6 +36,11 @@ export function VariableMenu({ container, element, onClose, variables }: Props) function handleChangeType(newType: string) { updateVariable(editor, { key: newType }); + + const newOption = options.find(({ value }) => value === newType); + if (newOption && !newOption.withFallback) { + updateVariable(editor, { fallback: '' }); + } } function handleSave() { @@ -46,12 +51,6 @@ export function VariableMenu({ container, element, onClose, variables }: Props) removeVariable(editor); } - useEffect(() => { - if (!option?.withFallback) { - updateVariable(editor, { fallback: '' }); - } - }, [option?.withFallback]); - return ( Date: Thu, 8 Aug 2024 14:31:23 +0200 Subject: [PATCH 2/2] Use only one function call --- .../slate-editor/src/extensions/variables/VariableMenu.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/slate-editor/src/extensions/variables/VariableMenu.tsx b/packages/slate-editor/src/extensions/variables/VariableMenu.tsx index 73e9a5965..e35399339 100644 --- a/packages/slate-editor/src/extensions/variables/VariableMenu.tsx +++ b/packages/slate-editor/src/extensions/variables/VariableMenu.tsx @@ -35,11 +35,11 @@ export function VariableMenu({ container, element, onClose, variables }: Props) const option = options.find(({ value }) => value === element.key); function handleChangeType(newType: string) { - updateVariable(editor, { key: newType }); - const newOption = options.find(({ value }) => value === newType); if (newOption && !newOption.withFallback) { updateVariable(editor, { fallback: '' }); + } else { + updateVariable(editor, { key: newType }); } }