From 01bf77252cace6f896b71306b992ff55cc5fe9e8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Mon, 27 Mar 2023 19:38:17 -0300 Subject: [PATCH 01/11] fix: handling token expiration --- src/components/App/AppRoutes/AppRoutes.tsx | 24 ++++++++++++++++++---- 1 file changed, 20 insertions(+), 4 deletions(-) diff --git a/src/components/App/AppRoutes/AppRoutes.tsx b/src/components/App/AppRoutes/AppRoutes.tsx index 9d35a51..e749fcf 100644 --- a/src/components/App/AppRoutes/AppRoutes.tsx +++ b/src/components/App/AppRoutes/AppRoutes.tsx @@ -29,12 +29,28 @@ export const AppRoutes = () => { keycloak.onTokenExpired = undefined; } keycloak.onTokenExpired = () => { - keycloak.updateToken(5); + keycloak + .updateToken(5) + .then(refreshed => { + if (refreshed) { + ApiClient.setup(keycloak.token); + } + }) + .catch(() => { + ApiClient.setup(keycloak.token); + }); }; // Force refresh token - keycloak.updateToken(-1); - ApiClient.setup(keycloak.token); - setHasMounted(true); + keycloak + .updateToken(-1) + .then(refreshed => { + ApiClient.setup(keycloak.token); + setHasMounted(true); + }) + .catch(() => { + ApiClient.setup(keycloak.token); + setHasMounted(true); + }); return () => { if (keycloak) keycloak.onTokenExpired = undefined; }; From a50444c9c56fe491c46144c0811486143d94fb4d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Mon, 27 Mar 2023 19:42:50 -0300 Subject: [PATCH 02/11] feat: unauthenticated error notification --- src/i18n/locales/en/translation.json | 4 ++++ src/i18n/locales/pt-BR/translation.json | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json index 3275437..008c267 100644 --- a/src/i18n/locales/en/translation.json +++ b/src/i18n/locales/en/translation.json @@ -102,6 +102,10 @@ "title": "Unauthorized", "message": "You do not have permission to access this resource." }, + "UNAUTHENTICATED": { + "title": "Unauthenticated", + "message": "You must be logged in to access this resource." + }, "FORBIDDEN": { "title": "Forbidden", "message": "You do not have permission to access this resource." diff --git a/src/i18n/locales/pt-BR/translation.json b/src/i18n/locales/pt-BR/translation.json index 56bbc64..5cf31dc 100644 --- a/src/i18n/locales/pt-BR/translation.json +++ b/src/i18n/locales/pt-BR/translation.json @@ -102,6 +102,10 @@ "title": "Não autorizado", "message": "Você não tem permissão para acessar este recurso." }, + "UNAUTHENTICATED": { + "title": "Não autenticado", + "message": "Você precisa fazer login para acessar este recurso." + }, "FORBIDDEN": { "title": "Proibido", "message": "Você não tem permissão para acessar este recurso." From 24e98c8175132f4a1c5998bb102e680fd2846996 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Mon, 27 Mar 2023 20:50:17 -0300 Subject: [PATCH 03/11] feat: bad template format i18n messages, and displaying error on EditTemplate pages --- src/i18n/locales/en/translation.json | 4 ++++ src/i18n/locales/pt-BR/translation.json | 4 ++++ src/pages/Menu/EditTemplate/EditTemplate.tsx | 3 ++- src/pages/Menu/Items/EditTemplate.tsx | 3 ++- 4 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json index 008c267..01c5297 100644 --- a/src/i18n/locales/en/translation.json +++ b/src/i18n/locales/en/translation.json @@ -141,6 +141,10 @@ "UNKNOWN": { "title": "Unknown error (code: {{code}})", "message": "An unexpected problem has occurred." + }, + "BAD_TEMPLATE_FORMAT": { + "title": "Invalid template format", + "message": "Check if the template is in the correct format." } } } diff --git a/src/i18n/locales/pt-BR/translation.json b/src/i18n/locales/pt-BR/translation.json index 5cf31dc..7e0da64 100644 --- a/src/i18n/locales/pt-BR/translation.json +++ b/src/i18n/locales/pt-BR/translation.json @@ -141,6 +141,10 @@ "UNKNOWN": { "title": "Erro desconhecido (código: {{code}})", "message": "Ocorreu um problema inesperado." + }, + "BAD_TEMPLATE_FORMAT": { + "title": "Formato de template inválido", + "message": "Verifique se o template está no formato correto." } } } diff --git a/src/pages/Menu/EditTemplate/EditTemplate.tsx b/src/pages/Menu/EditTemplate/EditTemplate.tsx index 0af82fc..5fd8b99 100644 --- a/src/pages/Menu/EditTemplate/EditTemplate.tsx +++ b/src/pages/Menu/EditTemplate/EditTemplate.tsx @@ -180,10 +180,11 @@ export const EditTemplateMenu = () => { } }, onError: error => { + openDefaultErrorNotification(error, dispatch); console.error(error); }, }); - }, [template, templateFormat, data, renderMenuTemplate]); + }, [template, templateFormat, data, renderMenuTemplate, dispatch]); const dracula = React.useMemo( () => diff --git a/src/pages/Menu/Items/EditTemplate.tsx b/src/pages/Menu/Items/EditTemplate.tsx index 72d495a..c0f2609 100644 --- a/src/pages/Menu/Items/EditTemplate.tsx +++ b/src/pages/Menu/Items/EditTemplate.tsx @@ -170,13 +170,14 @@ export const EditTemplateItems = () => { } }, onError: error => { + openDefaultErrorNotification(error, dispatch); console.error(error); }, }); } catch (error) { console.error(error); } - }, [template, templateFormat, data, itemId, renderMenuItemTemplate]); + }, [template, templateFormat, data, itemId, renderMenuItemTemplate, dispatch]); const dracula = React.useMemo( () => From 8410dac93f5a8ee275924b55e658612845fcdbf7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Mon, 27 Mar 2023 21:38:37 -0300 Subject: [PATCH 04/11] feat: disabling action buttons when there's no node selected --- src/components/Menu/Items/OperationScreen.tsx | 52 +++++++++++++++---- 1 file changed, 42 insertions(+), 10 deletions(-) diff --git a/src/components/Menu/Items/OperationScreen.tsx b/src/components/Menu/Items/OperationScreen.tsx index 03542f8..6e63975 100644 --- a/src/components/Menu/Items/OperationScreen.tsx +++ b/src/components/Menu/Items/OperationScreen.tsx @@ -96,7 +96,7 @@ export const OperationScreen = ({ const [updateMenu] = useMutation(MenuService.UPDATE_MENU); - const handleUpdate = () => { + const handleUpdate = async (): Promise => { const formatNodes = (nodes: INode[]) => nodes .map(node => { @@ -179,7 +179,7 @@ export const OperationScreen = ({ }; }); - updateMenu({ + await updateMenu({ variables: { menu: { id: Number(id), items } }, onCompleted: data => { dispatch({ @@ -189,17 +189,29 @@ export const OperationScreen = ({ context: 'male', })}!`, }); + switch (editingNode.action) { + case EnumInputAction.CREATE: + case EnumInputAction.DELETE: + setSelected(''); + break; + case EnumInputAction.UPDATE: + setSelected(editingNode.id.toString()); + break; + } setUpdatedMenu(data.updateMenu); setOperationScreen(EnumInputActionScreen.SELECTING_ACTION); setEditingNode(emptyEditingNode); + return Promise.resolve(); }, onError: error => { openDefaultErrorNotification(error, dispatch); + return Promise.reject(); }, }); + return Promise.resolve(); }; - const handleInsertSubmit = (e: React.FormEvent) => { + const handleInsertSubmit = async (e: React.FormEvent) => { e.preventDefault(); e.stopPropagation(); @@ -220,7 +232,11 @@ export const OperationScreen = ({ return; } - handleUpdate(); + try { + await handleUpdate(); + } catch (error) { + console.error(error); + } }; const handleUpdateSubmit = async (e: React.FormEvent) => { @@ -243,7 +259,22 @@ export const OperationScreen = ({ setLabelError(tmpLabelError); } - handleUpdate(); + try { + await handleUpdate(); + } catch (error) { + console.error(error); + } + }; + + const handleDeleteSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + e.stopPropagation(); + + try { + await handleUpdate(); + } catch (error) { + console.error(error); + } }; const handleActionChange = React.useCallback( @@ -491,6 +522,7 @@ export const OperationScreen = ({ sx={{ color: 'green' }} variant="outlined" color="success" + disabled={!selected} onClick={() => handleActionChange(EnumInputActionScreen.INSERT)} > @@ -501,7 +533,7 @@ export const OperationScreen = ({ fontSize: '0.75rem', lineHeight: '0.75rem', letterSpacing: '0.18px', - color: 'green', + color: selected ? 'green' : 'grey', ml: '0.5rem', }} > @@ -523,7 +555,7 @@ export const OperationScreen = ({ fontSize: '0.75rem', lineHeight: '0.75rem', letterSpacing: '0.18px', - color: selected ? 'orange' : 'grey', + color: selected && selected !== '0' ? 'orange' : 'grey', ml: '0.5rem', }} > @@ -545,7 +577,7 @@ export const OperationScreen = ({ fontSize: '0.75rem', lineHeight: '0.75rem', letterSpacing: '0.18px', - color: selected ? 'red' : 'grey', + color: selected && selected !== '0' ? 'red' : 'grey', ml: '0.5rem', }} > @@ -567,7 +599,7 @@ export const OperationScreen = ({ fontSize: '0.75rem', lineHeight: '0.75rem', letterSpacing: '0.18px', - color: 'black', + color: selected && selected !== '0' ? 'black' : 'grey', ml: '0.5rem', }} > @@ -1237,7 +1269,7 @@ export const OperationScreen = ({ variant="contained" color="success" sx={{ mt: '2rem', mr: '1rem' }} - onClick={handleUpdate} + onClick={handleDeleteSubmit} > {t('buttons.save')} From 8181306f2d54fc7127f2459e22f061987ab0a6b8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Mon, 27 Mar 2023 21:45:40 -0300 Subject: [PATCH 05/11] feat: no item selected error message --- src/components/Menu/Items/OperationScreen.tsx | 11 +++++++++++ src/i18n/locales/en/translation.json | 3 +++ src/i18n/locales/pt-BR/translation.json | 3 +++ 3 files changed, 17 insertions(+) diff --git a/src/components/Menu/Items/OperationScreen.tsx b/src/components/Menu/Items/OperationScreen.tsx index 6e63975..c68f3e2 100644 --- a/src/components/Menu/Items/OperationScreen.tsx +++ b/src/components/Menu/Items/OperationScreen.tsx @@ -509,6 +509,17 @@ export const OperationScreen = ({ > {t('menu.preview.actions.title')} + {!selected && ( + + {t('menu.preview.errors.noItemSelected')} + + )} Date: Wed, 29 Mar 2023 23:46:41 -0300 Subject: [PATCH 06/11] feat: codeDiff util --- src/utils/diff/codeDiff.ts | 50 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/utils/diff/codeDiff.ts diff --git a/src/utils/diff/codeDiff.ts b/src/utils/diff/codeDiff.ts new file mode 100644 index 0000000..89a66e1 --- /dev/null +++ b/src/utils/diff/codeDiff.ts @@ -0,0 +1,50 @@ +export const codeDiff = (oldCode: string, newCode: string): string => { + const oldLines = oldCode.split('\n'); + const newLines = newCode.split('\n'); + const max = Math.max(oldLines.length, newLines.length); + const lineChanged = (newIndex: number, oldIndex: number) => { + const newLine = newLines[newIndex]; + const oldLine = oldLines[oldIndex]; + if (newLine !== oldLine) { + return true; + } + return false; + }; + const diff = []; + let oldIndex = 0; + let newIndex = 0; + for (let i = 0; i < max; i++) { + if (i >= oldLines.length) { + for (let j = i; j < newLines.length; j++) { + diff.push(`+ ${newLines[j]}`); + } + break; + } else if (i >= newLines.length) { + for (let j = i; j < oldLines.length; j++) { + diff.push(`- ${oldLines[j]}`); + } + break; + } + if (lineChanged(newIndex, oldIndex)) { + diff.push(`- ${oldLines[i]}`); + for (let j = oldIndex + 1; j < oldLines.length; j++) { + if (lineChanged(i, j)) { + diff.push(`- ${oldLines[j]}`); + } + oldIndex = j; + } + for (let j = newIndex + 1; j < newLines.length; j++) { + if (lineChanged(j, i)) { + diff.push(`+ ${newLines[j]}`); + } + newIndex = j; + } + i = Math.max(oldIndex, newIndex); + } else { + diff.push(` ${oldLines[i]}`); + } + if (oldIndex >= oldLines.length - 1) oldIndex++; + if (newIndex >= newLines.length - 1) newIndex++; + } + return diff.join('\n'); +}; From 3d4e704c04ecd387aa8c0a47a77d2c325c7469d2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Wed, 29 Mar 2023 23:47:47 -0300 Subject: [PATCH 07/11] CodeViewer diff prop and displaying template diff on Pendencies List --- .babelrc | 4 +-- src/components/CodeViewer/CodeViewer.tsx | 14 ++++++++-- .../Menu/Pendencies/PendencyTableRow.tsx | 27 +++++++++++++++++-- 3 files changed, 39 insertions(+), 6 deletions(-) diff --git a/.babelrc b/.babelrc index d8b513f..0c845e4 100644 --- a/.babelrc +++ b/.babelrc @@ -15,8 +15,8 @@ ], "plugins": [ ["prismjs", { - "languages": ["json", "markup", "markup-templating", "handlebars"], - "plugins": ["line-numbers"], + "languages": ["json", "markup", "markup-templating", "handlebars", "diff"], + "plugins": ["line-numbers", "diff"], "css": true }] ] diff --git a/src/components/CodeViewer/CodeViewer.tsx b/src/components/CodeViewer/CodeViewer.tsx index 0369c31..97907e5 100644 --- a/src/components/CodeViewer/CodeViewer.tsx +++ b/src/components/CodeViewer/CodeViewer.tsx @@ -5,17 +5,21 @@ import 'prismjs/components/prism-json'; import 'prismjs/components/prism-markup'; import 'prismjs/components/prism-markup-templating'; import 'prismjs/components/prism-handlebars'; +import 'prismjs/components/prism-diff'; import 'prismjs/themes/prism.css'; import 'prismjs/plugins/line-numbers/prism-line-numbers'; import 'prismjs/plugins/line-numbers/prism-line-numbers.css'; +import 'prismjs/plugins/diff-highlight/prism-diff-highlight'; +import 'prismjs/plugins/diff-highlight/prism-diff-highlight.css'; interface Props { code: string; language: string; lineNumbers?: boolean; + diff?: boolean; } -const CodeViewer = ({ code, language, lineNumbers = true }: Props) => { +const CodeViewer = ({ code, language, lineNumbers = true, diff = false }: Props) => { language = language === 'plain' ? 'json' : language; useEffect(() => { Prism.highlightAll(); @@ -23,7 +27,13 @@ const CodeViewer = ({ code, language, lineNumbers = true }: Props) => { return ( 
-        {code}
+        
+          {code}
+
); diff --git a/src/components/Menu/Pendencies/PendencyTableRow.tsx b/src/components/Menu/Pendencies/PendencyTableRow.tsx index e957a5b..5dba76c 100644 --- a/src/components/Menu/Pendencies/PendencyTableRow.tsx +++ b/src/components/Menu/Pendencies/PendencyTableRow.tsx @@ -9,10 +9,21 @@ import ThumbDownOffAltIcon from '@mui/icons-material/ThumbDownOffAlt'; import { EnumInputAction, IMenu, IMenuPendency } from '../../../types'; import CodeViewer from '../../CodeViewer'; import { IUpdateMenuItemInput, IUpdateMenuMetaInput } from '../../../types/input'; +import { codeDiff } from '../../../utils/diff/codeDiff'; const PendencyChanges = ({ menu, pendency }: { menu: IMenu; pendency: IMenuPendency }) => { const { i18n, t } = useTranslation(); + const templateDiff = React.useMemo(() => { + if (pendency.input.template) { + const oldTemplate = + menu.template || + menu.defaultTemplate?.[pendency.input.templateFormat || menu.templateFormat]; + return codeDiff(oldTemplate, pendency.input.template); + } + return ''; + }, [menu, pendency]); + const getActionColor = (action: EnumInputAction) => { switch (action) { case EnumInputAction.CREATE: @@ -43,6 +54,18 @@ const PendencyChanges = ({ menu, pendency }: { menu: IMenu; pendency: IMenuPende const order = item.order || menu.items.find(i => i.id === item.id)?.order || index + 1; const label = menu.items.find(i => i.id === item.id)?.label || item.label; const actionColor = getActionColor(item.action); + let templateDiff = ''; + if (item.template) { + const oldItem = menu.items.find(i => i.id === item.id); + const oldTemplate = + oldItem.template || + oldItem.defaultTemplate[ + item.templateFormat || oldItem.templateFormat || menu.templateFormat + ]; + if (oldTemplate) { + templateDiff = codeDiff(oldTemplate, item.template); + } + } return ( @@ -101,7 +124,7 @@ const PendencyChanges = ({ menu, pendency }: { menu: IMenu; pendency: IMenuPende {t('menuItem.fields.template')}: - + )} {item.meta && Object.keys(item.meta).length > 0 && ( @@ -215,7 +238,7 @@ const PendencyChanges = ({ menu, pendency }: { menu: IMenu; pendency: IMenuPende {t('menu.fields.template')}: - + )} {pendency.input.meta && pendency.input.meta.length > 0 && ( From f9b955fdbbe39a17596bebb7a7b582c530a2d577 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Thu, 30 Mar 2023 01:10:01 -0300 Subject: [PATCH 08/11] feat: revision template diff --- src/components/Menu/Revisions/Diff.tsx | 63 ++++++++++++++++++++++---- 1 file changed, 53 insertions(+), 10 deletions(-) diff --git a/src/components/Menu/Revisions/Diff.tsx b/src/components/Menu/Revisions/Diff.tsx index 626d5ed..22e2c9a 100644 --- a/src/components/Menu/Revisions/Diff.tsx +++ b/src/components/Menu/Revisions/Diff.tsx @@ -1,20 +1,58 @@ import React from 'react'; -import { Box, Typography } from '@mui/material'; +import { Box, styled, Typography } from '@mui/material'; +import MuiAccordion, { AccordionProps } from '@mui/material/Accordion'; +import MuiAccordionSummary, { AccordionSummaryProps } from '@mui/material/AccordionSummary'; +import MuiAccordionDetails from '@mui/material/AccordionDetails'; import ArrowForwardIcon from '@mui/icons-material/ArrowForward'; -import { Link } from 'react-router-dom'; +import ArrowForwardIosSharpIcon from '@mui/icons-material/ArrowForwardIosSharp'; import { useTranslation } from 'react-i18next'; +import { codeDiff } from '../../../utils/diff/codeDiff'; +import CodeViewer from '../../CodeViewer'; interface Props { id: string; diff: any; snapshot: any; - renderTemplateChanges?: (from: any, to: any, linkPath: string) => JSX.Element; } -export const MenuRevisionsDiff = ({ id, diff, snapshot, renderTemplateChanges }: Props) => { +const Accordion = styled((props: AccordionProps) => ( + +))(({ theme }) => ({ + border: `1px solid ${theme.palette.divider}`, + '&:not(:last-child)': { + borderBottom: 0, + }, + '&:before': { + display: 'none', + }, +})); + +const AccordionSummary = styled((props: AccordionSummaryProps) => ( + } + {...props} + /> +))(({ theme }) => ({ + backgroundColor: + theme.palette.mode === 'dark' ? 'rgba(255, 255, 255, .05)' : 'rgba(0, 0, 0, .03)', + flexDirection: 'row-reverse', + '& .MuiAccordionSummary-expandIconWrapper.Mui-expanded': { + transform: 'rotate(90deg)', + }, + '& .MuiAccordionSummary-content': { + marginLeft: theme.spacing(1), + }, +})); + +const AccordionDetails = styled(MuiAccordionDetails)(({ theme }) => ({ + padding: theme.spacing(2), + borderTop: '1px solid rgba(0, 0, 0, .125)', +})); + +export const MenuRevisionsDiff = ({ id, diff, snapshot }: Props) => { const { t } = useTranslation(); - const defaultRenderTemplateChanges = (from: any, to: any, linkPath: string) => { + const renderTemplateChanges = (from: any, to: any, linkPath: string) => { if (to === undefined || (from === undefined && to === null)) return ( @@ -33,15 +71,20 @@ export const MenuRevisionsDiff = ({ id, diff, snapshot, renderTemplateChanges }: {t('common.changed', { context: 'male' })} ); + const fromTemplate = from || ''; + const templateDiff = codeDiff(fromTemplate, to); return ( - - {t('common.viewChanges')} - + + + {t('common.viewChanges')} + + + + + ); }; - renderTemplateChanges = renderTemplateChanges || defaultRenderTemplateChanges; - const renderChanges = (from?: any, to?: any) => { if (to === undefined || (from === undefined && to === null) || from === to) return ( From e0ddd1e330625f943745590a161aa35923264fcb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Thu, 30 Mar 2023 01:30:22 -0300 Subject: [PATCH 09/11] fix: codeDiff util improvements --- src/utils/diff/codeDiff.ts | 29 ++++++++++++++++++++--------- 1 file changed, 20 insertions(+), 9 deletions(-) diff --git a/src/utils/diff/codeDiff.ts b/src/utils/diff/codeDiff.ts index 89a66e1..7dbd4ee 100644 --- a/src/utils/diff/codeDiff.ts +++ b/src/utils/diff/codeDiff.ts @@ -14,37 +14,48 @@ export const codeDiff = (oldCode: string, newCode: string): string => { let oldIndex = 0; let newIndex = 0; for (let i = 0; i < max; i++) { - if (i >= oldLines.length) { - for (let j = i; j < newLines.length; j++) { + if (!oldLines.length || i >= oldLines.length) { + for (let j = newIndex; j < newLines.length; j++) { diff.push(`+ ${newLines[j]}`); } break; } else if (i >= newLines.length) { - for (let j = i; j < oldLines.length; j++) { + for (let j = oldIndex; j < oldLines.length; j++) { diff.push(`- ${oldLines[j]}`); } break; } if (lineChanged(newIndex, oldIndex)) { diff.push(`- ${oldLines[i]}`); + let k = i + 1; for (let j = oldIndex + 1; j < oldLines.length; j++) { - if (lineChanged(i, j)) { + if (k >= newLines.length) break; + if (lineChanged(k, j)) { diff.push(`- ${oldLines[j]}`); + oldIndex = j; + k++; + } else { + break; } - oldIndex = j; } + diff.push(`+ ${oldLines[i]}`); + k = i + 1; for (let j = newIndex + 1; j < newLines.length; j++) { - if (lineChanged(j, i)) { + if (k >= oldLines.length) break; + if (lineChanged(j, k)) { diff.push(`+ ${newLines[j]}`); + oldIndex = j; + k++; + } else { + break; } - newIndex = j; } i = Math.max(oldIndex, newIndex); } else { diff.push(` ${oldLines[i]}`); } - if (oldIndex >= oldLines.length - 1) oldIndex++; - if (newIndex >= newLines.length - 1) newIndex++; + if (oldIndex <= oldLines.length - 1) oldIndex++; + if (newIndex <= newLines.length - 1) newIndex++; } return diff.join('\n'); }; From 93e2c54c27504c6143ede358c775ba8007bed5ec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Thu, 30 Mar 2023 01:30:41 -0300 Subject: [PATCH 10/11] style: accordion margin top --- src/components/Menu/Revisions/Diff.tsx | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/src/components/Menu/Revisions/Diff.tsx b/src/components/Menu/Revisions/Diff.tsx index 22e2c9a..2ce330d 100644 --- a/src/components/Menu/Revisions/Diff.tsx +++ b/src/components/Menu/Revisions/Diff.tsx @@ -74,14 +74,16 @@ export const MenuRevisionsDiff = ({ id, diff, snapshot }: Props) => { const fromTemplate = from || ''; const templateDiff = codeDiff(fromTemplate, to); return ( - - - {t('common.viewChanges')} - - - - - + + + + {t('common.viewChanges')} + + + + + + ); }; From ad3b37f1671ce6ae2a531b7ea88f8ea201c82678 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Elias=20Feij=C3=B3=20de=20Almeida=20Pereira=20Lima?= Date: Thu, 30 Mar 2023 02:09:33 -0300 Subject: [PATCH 11/11] fix: codeDiff push line from newCode --- src/utils/diff/codeDiff.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/diff/codeDiff.ts b/src/utils/diff/codeDiff.ts index 7dbd4ee..1c73adb 100644 --- a/src/utils/diff/codeDiff.ts +++ b/src/utils/diff/codeDiff.ts @@ -38,7 +38,7 @@ export const codeDiff = (oldCode: string, newCode: string): string => { break; } } - diff.push(`+ ${oldLines[i]}`); + diff.push(`+ ${newLines[i]}`); k = i + 1; for (let j = newIndex + 1; j < newLines.length; j++) { if (k >= oldLines.length) break;