Translate the revert last checkpoint command and improve task editing behavior to prevent accidental deletion of tasks with content

- when editing task, focus-out should remove it (if it doesnt have any children)
- when task is saved but the value was removed, restore it  as we don't allow empty tasks.
- fix [Fragment]
- fix [Pasted text], make sure translations are quite concise as it is used in tooltip
- fix [Pasted text], make sure translations are quite concise as it is used in tooltip

Author: robertpiosik

apps/editor/src/views/panel/frontend/Home/Home.tsx

@@ -197,7 +197,7 @@ export const Home: React.FC<Props> = (props) => {
                     {props.has_temp_checkpoint && (
                       <UiIconButton
                         codicon_icon="discard"
-                        title={'command.checkpoints.revert-last'}
+                        title={t('command.checkpoints.revert-last')}
                         on_click={(e) => {
                           e.stopPropagation()
                           props.on_restore_temp_checkpoint()

apps/editor/src/views/panel/frontend/i18n/translations/checkpoints.ts

@@ -160,5 +160,24 @@ export const checkpoints = {
     cs: 'Před obnovením kontrolního bodu',
     hu: 'Ellenőrzőpont visszaállítása előtt',
     bg: 'Преди възстановяване на контролна точка'
+  },
+  'command.checkpoints.revert-last': {
+    en: 'Revert last restored checkpoint',
+    pl: 'Cofnij ostatnie przywrócenie',
+    'zh-cn': '撤销上次恢复',
+    ja: '最後の復元を元に戻す',
+    'zh-tw': '撤銷上次還原',
+    de: 'Wiederherstellung rückgängig machen',
+    es: 'Deshacer última restauración',
+    fr: 'Annuler la dernière restauration',
+    'pt-br': 'Desfazer última restauração',
+    ru: 'Отменить последнее восстановление',
+    ko: '마지막 복원 취소',
+    it: 'Annulla ultimo ripristino',
+    tr: 'Son geri yüklemeyi geri al',
+    cs: 'Vrátit poslední obnovení',
+    hu: 'Visszaállítás visszavonása',
+    bg: 'Отмяна на възстановяването'
   }
 } as const
+

packages/ui/src/components/editor/panel/Tasks/Tasks.tsx

@@ -58,13 +58,35 @@ export const Tasks: React.FC<Props> = (props) => {
   const [editing_timestamp, set_editing_timestamp] = useState<number | null>(
     null
   )
+  const [editing_initial_text, set_editing_initial_text] = useState<string>('')
   const [forwarded_timestamp, set_forwarded_timestamp] = useState<
     number | null
   >(null)
   const [copied_timestamp, set_copied_timestamp] = useState<number | null>(null)
   const prevent_edit_ref = useRef(false)
 
-  use_auto_focus_new_task(props.tasks, set_editing_timestamp)
+  const handle_set_editing = (timestamp: number | null, text?: string) => {
+    set_editing_timestamp(timestamp)
+    if (text !== undefined) {
+      set_editing_initial_text(text)
+    }
+  }
+
+  use_auto_focus_new_task(props.tasks, handle_set_editing)
+
+  const handle_stop_editing = (task: Task) => {
+    if (editing_timestamp !== task.created_at) return
+    set_editing_timestamp(null)
+    if (!task.text.trim()) {
+      const has_children = task.children && task.children.length > 0
+      if (!editing_initial_text.trim() && !has_children) {
+        props.on_delete(task.created_at)
+      } else if (editing_initial_text.trim()) {
+        const { id, ...rest } = task as any
+        props.on_change({ ...rest, text: editing_initial_text })
+      }
+    }
+  }
 
   const tree = useMemo(() => add_ids(props.tasks), [props.tasks])
 
@@ -200,11 +222,13 @@ export const Tasks: React.FC<Props> = (props) => {
                 on_mouse_down={
                   is_editing ? (e) => e.preventDefault() : undefined
                 }
-                on_click={() =>
-                  set_editing_timestamp(
-                    is_editing ? null : params.task.created_at
-                  )
-                }
+                on_click={() => {
+                  if (is_editing) {
+                    handle_stop_editing(params.task)
+                  } else {
+                    handle_set_editing(params.task.created_at, params.task.text)
+                  }
+                }}
                 title={is_editing ? 'Done' : 'Edit'}
               />
               <IconButton
@@ -226,11 +250,12 @@ export const Tasks: React.FC<Props> = (props) => {
                 props.on_change({ ...rest, text: value })
               }}
               autofocus
-              on_blur={() => set_editing_timestamp(null)}
+              on_blur={() => {
+                handle_stop_editing(params.task)
+              }}
               on_key_down={(e) => {
                 if (e.key == 'Enter' && !e.shiftKey) {
                   e.preventDefault()
-                  set_editing_timestamp(null)
                 }
               }}
             />
@@ -253,7 +278,7 @@ export const Tasks: React.FC<Props> = (props) => {
               }}
               onClick={() => {
                 if (prevent_edit_ref.current) return
-                set_editing_timestamp(params.task.created_at)
+                handle_set_editing(params.task.created_at, params.task.text)
               }}
             >
               {params.task.text || props.placeholder}

packages/ui/src/components/editor/panel/Tasks/hooks/use-auto-focus-new-task.ts

@@ -3,7 +3,7 @@ import { Task } from '@shared/types/task'
 
 export const use_auto_focus_new_task = (
   tasks: Task[],
-  set_editing_timestamp: (timestamp: number | null) => void
+  set_editing_timestamp: (timestamp: number | null, text?: string) => void
 ) => {
   const prev_ids_ref = useRef<Set<number>>(new Set())
   const is_first_render = useRef(true)
@@ -34,7 +34,7 @@ export const use_auto_focus_new_task = (
     if (added_ids.length == 1) {
       const new_task = id_to_task.get(added_ids[0])
       if (new_task && new_task.text == '') {
-        set_editing_timestamp(added_ids[0])
+        set_editing_timestamp(added_ids[0], '')
       }
     }