From 1a0d324ef4e866b7e4bfbb08a8d25bcf0449c958 Mon Sep 17 00:00:00 2001 From: Etienne ANNE Date: Tue, 1 Oct 2024 11:36:25 +0200 Subject: [PATCH] reset mail internationalization --- .../components/adminbackoffice/cms/index.tsx | 27 -- .../adminbackoffice/tenants/MailInput.tsx | 292 ------------------ .../tenants/MailingInternalization.tsx | 232 ++++---------- .../javascript/src/contexts/navContext.tsx | 2 +- .../src/locales/en/translation.json | 1 - .../src/locales/fr/translation.json | 1 - 6 files changed, 62 insertions(+), 493 deletions(-) delete mode 100644 daikoku/javascript/src/components/adminbackoffice/tenants/MailInput.tsx diff --git a/daikoku/javascript/src/components/adminbackoffice/cms/index.tsx b/daikoku/javascript/src/components/adminbackoffice/cms/index.tsx index c84eff40f..ead80e53d 100644 --- a/daikoku/javascript/src/components/adminbackoffice/cms/index.tsx +++ b/daikoku/javascript/src/components/adminbackoffice/cms/index.tsx @@ -122,15 +122,6 @@ export const CMSOffice = () => {

Pages

- {/*
- -
    */} -
  • importRef.current?.click()}> - importRef.current = r} type="file" accept=".zip" className="form-control hide" onChange={loadFiles} /> - {translate('cms.import_all')} -
    • - {/*
*/} - {/*
*/} - {/* */}
diff --git a/daikoku/javascript/src/components/adminbackoffice/tenants/MailInput.tsx b/daikoku/javascript/src/components/adminbackoffice/tenants/MailInput.tsx deleted file mode 100644 index e2add8ea7..000000000 --- a/daikoku/javascript/src/components/adminbackoffice/tenants/MailInput.tsx +++ /dev/null @@ -1,292 +0,0 @@ -import { CodeInput } from '@maif/react-forms'; -import { useEffect, useRef, useState } from "react"; - -import showdown from 'showdown'; - -import '@fortawesome/fontawesome-free/css/all.css'; -import 'highlight.js/styles/monokai.css'; -import { getCmsPage, getMailTranslations } from '../../../services'; -import { PillButton } from '../../inputs/PillButton'; -import Select from 'react-select'; - -function extractRequiredVariables(str?: string) { - const dels: Array = []; - const words: Array = []; - - if (!str) - return [] - - for (let i = 0; i < str.length; i++) { - if (str[i] === '[') { - dels.push(i); - } else if (str[i] === ']' && dels.length > 0) { - let pos = dels[dels.length - 1]; - dels.pop(); - - const len = i - 1 - pos; - words.push(str.substring(pos + 1, (pos < len ? len : len + pos) + 1)); - } - } - - if (str.includes("{{email}}")) - words.push("{{email}}") - - return [...new Set(words)]; -} - -function overwriteParameters(parameters, content) { - if (!content) - return "" - - let out = content; - - if (content.includes('{{email}}')) { - out = out.replaceAll(`{{email}}`, parameters.email) - } - - console.log(out) - - for (const parameter in parameters) { - if (parameter !== '{{email}}') { - out = out - .replaceAll(`[${parameter}]`, parameters[parameter]) - } - } - - // console.log({ parameters, content, out }) - return out; -} - -const converter = new showdown.Converter({ - omitExtraWLInCodeBlocks: true, - ghCompatibleHeaderId: true, - parseImgDimensions: true, - simplifiedAutoLink: true, - tables: true, - tasklists: true, - requireSpaceBeforeHeadingText: true, - ghMentions: true, - emoji: true, - ghMentionsLink: '/{u}' -}); - -interface Range { - from: any; - to: any; -} - - -const commands = [ - { - name: 'Add header', - icon: 'heading', - inject: (range: Range) => [{ from: range.from, insert: "# " }] - }, - { - name: 'Add bold text', - icon: 'bold', - inject: (range: Range) => [{ from: range.from, insert: "**" }, { from: range.to, insert: '**' }] - }, - { - name: 'Add italic text', - icon: 'italic', - inject: (range: Range) => [{ from: range.from, insert: '*' }, { from: range.to, insert: '*' }] - }, - { - name: 'Add strikethrough text', - icon: 'strikethrough', - inject: (range: Range) => [{ from: range.from, insert: '~~' }, { from: range.to, insert: '~~' }] - }, - { - name: 'Add link', - icon: 'link', - inject: (range: Range) => [{ from: range.from, insert: '[' }, { from: range.to, insert: '](url)' }] - }, - { - name: 'Add code', - icon: 'code', - inject: (range: Range) => [{ from: range.from, insert: '```\n' }, { from: range.to, insert: '\n```\n' }] - }, - { - name: 'Add quotes', - icon: 'quote-right', - inject: (range: Range) => [{ from: range.from, insert: '> ' }] - }, - { - name: 'Add image', - icon: 'image', - inject: (range: Range) => [{ from: range.from, insert: '![' }, { from: range.to, insert: '](image-url)' }] - }, - { - name: 'Add unordered list', - icon: 'list-ul', - inject: (range: Range) => [{ from: range.from, insert: '* ' }] - }, - { - name: 'Add ordered list', - icon: 'list-ol', - inject: (range: Range) => [{ from: range.from, insert: '1. ' }] - }, - { - name: 'Add check list', - icon: 'tasks', - inject: (range: Range) => [{ from: range.from, insert: '* [ ] ' }] - } -]; - -const DEFAULT_PARAMETERS = { - apiName: "WeatherAPI", - user: "john.doe", - team: "Development", - link: "https://weatherapi.example.com", - teamName: "Backend Team", - subscription: "Premium Plan", - "api.name": "WeatherAPI", - "api.plan": "Pro Plan", - subject: "New API Subscription", - email: "john.doe@to.tools", - body: "Bonjour, Vous avez souscrit à la WeatherAPI avec succès. Votre plan actuel est 'Pro Plan'.", - tenant: "Acme Corp", - urlAccept: "https://example.com/accept", - urlDecline: "https://example.com/decline", - "{{email}}": "" -} - -export function MailInput({ legacyInformations, cmsPageId }) { - - const [useCmsPage, setUseCmsPage] = useState(false) - - const [content, setContent] = useState() - const [parameters, setParameters] = useState(DEFAULT_PARAMETERS) - - const language = 'fr' - - useEffect(() => { - if (useCmsPage) - getCmsPage(`${cmsPageId}${language}`, { - ...parameters, - email: parameters["{{email}}"] - }) - .then(content => setContent(content)) - }, [useCmsPage, parameters["{{email}}"]]) - - console.log({ - content, - }) - - return <> -
-
-
Format du mail
- setUseCmsPage(false)} - onRightClick={() => setUseCmsPage(true)} - rightEnabled={!useCmsPage} - onChange={console.log} - /> - -
-
- -
-
- -} - -function Parameters({ parameters, setParameters, content, rawContent }) { - const [emails, setEmails] = useState([]) - const [email, setEmail] = useState() - - useEffect(() => { - getMailTranslations() - // @ts-ignore - .then(r => r.translations - .sort((a, b) => a._id.split(".")[1] < b._id.split(".")[1] ? -1 : 1) - .map(r => ({ label: r._id, value: r.content }))) - .then(setEmails) - }, []) - - const requiredRarameters = extractRequiredVariables(rawContent); - - return
- - setParameters({ - ...parameters, - [field]: e.target.value - })} style={{ flex: 1 }} /> -
- })} - - -} - -function Preview({ content, rawContent, useCmsPage, parameters, setParameters }) { - - return
-
Prévisualisation des mails
- - - - {useCmsPage ? -
: - -
} -
-} - -function MailContent({ useCmsPage, cmsPageId, legacyInformations, onLegacyInformationsChange }) { - - if (useCmsPage) - return

La page utilisé est {cmsPageId}

- - return -} \ No newline at end of file diff --git a/daikoku/javascript/src/components/adminbackoffice/tenants/MailingInternalization.tsx b/daikoku/javascript/src/components/adminbackoffice/tenants/MailingInternalization.tsx index edf05f2e3..eff0fc298 100644 --- a/daikoku/javascript/src/components/adminbackoffice/tenants/MailingInternalization.tsx +++ b/daikoku/javascript/src/components/adminbackoffice/tenants/MailingInternalization.tsx @@ -1,8 +1,8 @@ -import { Form, MarkdownInput, constraints, format, type } from '@maif/react-forms'; +import { Form, constraints, format, type } from '@maif/react-forms'; import { createColumnHelper } from '@tanstack/react-table'; import { nanoid } from 'nanoid'; import { useContext, useEffect, useRef, useState } from 'react'; -import { Link, useLocation, useParams } from 'react-router-dom'; +import { Link, useParams } from 'react-router-dom'; import { toast } from 'sonner'; import { ModalContext, useTenantBackOffice } from '../../../contexts'; @@ -15,17 +15,10 @@ import { Table, TableRef } from '../../inputs'; import { Can, Option, Spinner, tenant as TENANT, manage } from '../../utils'; import { BeautifulTitle } from '../../utils/BeautifulTitle'; import { EditFrontOfficeTranslations } from './EditFrontOfficeTranslations'; -import { MailInput } from './MailInput'; - -const MAIL_CATEGORIES = [ - 'subscription', 'new', 'create', 'apikey', 'team', 'api', - 'contact', 'user', 'checkout', 'rejection', 'acceptation' -] const EditMailtemplate = ({ - tenantId, - mails -}: { tenantId: string, mails: any }) => { + tenantId +}: { tenantId: string }) => { const [tenant, setTenant] = useState(); const [mailTemplateTranslations, setMailTemplateTranslations] = useState>([]); @@ -114,7 +107,6 @@ const EditMailtemplate = ({ label: null, defaultValue: '{{email}}', props: { - readOnly: true, actions: (insert: any) => { return ( - { - // setTenant({ - // ...tenant, - // mailerSettings: { - // ...tenant.mailerSettings, - // template - // } - // }) - // saveTenant({ - // ...tenant, - // mailerSettings: { - // ...tenant.mailerSettings, - // template - // }, - // }) - // }} - // title="Default mail template" - /> - {/* {mailTemplateTranslations +
+ {translate('Default mail template')} +
+
{ + saveTenant({ + ...tenant, + mailerSettings: { + ...tenant.mailerSettings, + template: t.value, + }, + }) + }} /> +
+
+ {mailTemplateTranslations .map((translation) => { return (
{translate('Translation')} : {translation.language} @@ -172,75 +156,10 @@ const EditMailtemplate = ({
); - })} */} + })}
); }; -function Breadcrumb() { - const { pathname } = useLocation() - - let parts = pathname.replace("/settings", "") - .split("/") - - if (parts.length === 2) - return null - - parts = parts.filter(f => f) - - return

- {parts - .map((part, i) => { - return - - - })} -

-} - -function InternalizationChooser({ domain, translate }) { - - const links = [ - { - active: "mail", - translation: 'mailing_internalization.mail_tab', - description: 'mailing_internalization.mail_description' - }, - { - active: "mail-template", - translation: 'mailing_internalization.mail_template_tab', - description: 'mailing_internalization.mail_template_description' - }, - { - active: "front", - translation: 'mailing_internalization.front_office_tab', - description: 'mailing_internalization.front_office_description' - }, - ] - - return
- {links.map(({ active, translation, description }) => { - return
-
- {translate(translation)} -
-
-

{translate(description)}

- - {translate('mailing_internalization.action')} - -
-
- })} -
-} - export const MailingInternalization = () => { useTenantBackOffice(); const table = useRef(); @@ -251,9 +170,6 @@ export const MailingInternalization = () => { const { translate, Translation } = useContext(I18nContext); const { openFormModal } = useContext(ModalContext); - const [category, setCategory] = useState() - const [mails, setMails] = useState() - const saveTranslation = (translation: any) => { Services.saveTranslation(translation) .then((res) => { @@ -285,17 +201,7 @@ export const MailingInternalization = () => { const columnHelper = createColumnHelper() const columns = [ - columnHelper.display({ - cell: info => { - return <> -

- {translate("mailing_internalization.usage")} : {info.row.original._id.replace("mail.", "").split(".").join(" > ")} -

-

- {translate(info.row.original._id)} -

- - }, + columnHelper.accessor(row => translate(row._id), { id: 'message', header: translate('mailing_internalization.message_text'), meta: { style: { textAlign: 'left' } }, @@ -308,10 +214,10 @@ export const MailingInternalization = () => { enableColumnFilter: false, cell: (info) => { return ( -
+
{getRequiredVariables(info.getValue()) .map((word, i) => ( - + [{word}] ))} @@ -322,7 +228,7 @@ export const MailingInternalization = () => { columnHelper.display({ id: 'actions', meta: { style: { textAlign: 'center' } }, - header: translate('Translation'), + header: translate('Translate'), enableSorting: false, enableColumnFilter: false, cell: (info) => { @@ -362,70 +268,54 @@ export const MailingInternalization = () => { }) ] - const loadEmails = () => { - Services.getMailTranslations() - .then(r => isError(r) ? r : r.translations - .sort((a, b) => a._id.split(".")[1] < b._id.split(".")[1] ? -1 : 1)) - .then(setMails) - } - - useEffect(() => { - if (domain === 'mail') { - loadEmails() - } - }, [domain]) - - useEffect(() => { - if (table.current) - table.current.update() - }, [mails, category]) - return (

+
    +
  • + + + {translate('mailing_internalization.mail_tab')} + +
    • +
  • + + + {translate('mailing_internalization.mail_template_tab')} + +
    • +
  • + + + {translate('mailing_internalization.front_office_tab')} + +
    • +
- {!domain && - } - - - {domain === 'mail' && <> -
- Catégories : - {
- {['all', ...MAIL_CATEGORIES - .sort()] - .map(cat => { - return - })} -
} -
+ {domain === 'mail' && ( { - if (!category || category === 'all') { - return Promise.resolve(mails) - } - return Promise.resolve(mails.filter(mail => mail._id.split(".")[1] === category)) - }} + fetchItems={() => Services.getMailTranslations() + .then(r => isError(r) ? r : r.translations)} ref={table} /> - } + )} {domain === 'mail-template' && } {domain === 'front' && } ); -}; +}; \ No newline at end of file diff --git a/daikoku/javascript/src/contexts/navContext.tsx b/daikoku/javascript/src/contexts/navContext.tsx index 9c4905a1c..db61d2d79 100644 --- a/daikoku/javascript/src/contexts/navContext.tsx +++ b/daikoku/javascript/src/contexts/navContext.tsx @@ -882,7 +882,7 @@ export const useTenantBackOffice = (maybeTenant?: ITenant) => { }, internationalization: { label: translate('internationalization'), - action: () => navigateTo('internationalization'), + action: () => navigateTo('internationalization/mail'), className: { active: currentTab === 'internationalization' }, }, pages: { diff --git a/daikoku/javascript/src/locales/en/translation.json b/daikoku/javascript/src/locales/en/translation.json index 60940c8e6..4333d0acc 100644 --- a/daikoku/javascript/src/locales/en/translation.json +++ b/daikoku/javascript/src/locales/en/translation.json @@ -1149,7 +1149,6 @@ "cms.revisions.restore": "Restore this version", "cms.revisions.delete_sentence": "Are you sure to restore this version ?", "cms.revisions.version_history": "Version history", - "cms.import_all": "Import", "updated password can't be saved": "Updated password can't be saved", "incorrect password": "Incorrect password", "Standard mode": "Standard mode", diff --git a/daikoku/javascript/src/locales/fr/translation.json b/daikoku/javascript/src/locales/fr/translation.json index 73ff5c1bc..9ab950b59 100644 --- a/daikoku/javascript/src/locales/fr/translation.json +++ b/daikoku/javascript/src/locales/fr/translation.json @@ -1149,7 +1149,6 @@ "cms.revisions.restore": "Restaurer cette version", "cms.revisions.delete_sentence": "Êtes-vous sûr de vouloir restaurer cette version ?", "cms.revisions.version_history": "Historique", - "cms.import_all": "Importer", "updated password can't be saved": "Le mots de passe n'a pu être mis à jour.", "incorrect password": "Mots de passe incorrect", "Standard mode": "Mode standard",