Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added copy-as buttons for HTML and Markdown #317

Closed
wants to merge 1 commit into from
Closed

Added copy-as buttons for HTML and Markdown #317

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 52 additions & 2 deletions src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { Button } from '@openfun/cunningham-react';
import { Button, VariantType, useToastProvider } from '@openfun/cunningham-react';
import React, { useState } from 'react';
import { useTranslation } from 'react-i18next';

import { Box, DropButton, IconOptions, Text } from '@/components';
import { useAuthStore } from '@/core';
import { usePanelEditorStore } from '@/features/docs/doc-editor/';
import { usePanelEditorStore, useDocStore } from '@/features/docs/doc-editor/';
import {
Doc,
ModalRemoveDoc,
Expand All @@ -31,6 +31,24 @@ export const DocToolBox = ({ doc, versionId }: DocToolBoxProps) => {
const [isModalVersionOpen, setIsModalVersionOpen] = useState(false);
const { isSmallMobile } = useResponsiveStore();
const { authenticated } = useAuthStore();
const { docsStore } = useDocStore();
const { toast } = useToastProvider();

const getDocContentFormatted = (format: 'html'|'markdown'): Promise<string> => {
const editor = docsStore[doc.id]?.editor;
if (!editor) {
return Promise.reject(new Error('Editor not available'));
}

switch (format) {
case 'html':
return editor.blocksToHTMLLossy();
case 'markdown':
return editor.blocksToMarkdownLossy();
default:
return Promise.reject(new Error(`Unsupported format: ${format}`));
}
}

return (
<Box
Expand Down Expand Up @@ -125,6 +143,38 @@ export const DocToolBox = ({ doc, versionId }: DocToolBoxProps) => {
<Text $theme="primary">{t('Delete document')}</Text>
</Button>
)}
<Button
onClick={() => {
setIsDropOpen(false);
getDocContentFormatted('markdown')
.then((docContentFormatted) => {
navigator.clipboard.writeText(docContentFormatted);
toast(t('Copied to clipboard'), VariantType.SUCCESS, { duration: 3000 })}
)
.catch(() => toast(t('Failed to copy to clipboard'), VariantType.ERROR, { duration: 3000 }))
}}
color="primary-text"
icon={<span className="material-icons">content_copy</span>}
size="small"
>
<Text $theme="primary">{t('Copy as {{target}}', {target: "Markdown"})}</Text>
</Button>
<Button
onClick={() => {
setIsDropOpen(false);
getDocContentFormatted('html')
.then((docContentFormatted) => {
navigator.clipboard.writeText(docContentFormatted);
toast(t('Copied to clipboard'), VariantType.SUCCESS, { duration: 3000 })}
)
.catch(() => toast(t('Failed to copy to clipboard'), VariantType.ERROR, { duration: 3000 }))
}}
color="primary-text"
icon={<span className="material-icons">content_copy</span>}
size="small"
>
<Text $theme="primary">{t('Copy as {{target}}', {target: "HTML"})}</Text>
</Button>
</Box>
</DropButton>
</Box>
Expand Down
3 changes: 3 additions & 0 deletions src/frontend/apps/impress/src/i18n/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@
"Content modal to export the document": "Contenu modal pour exporter le document",
"Cookies placed": "Cookies déposés",
"Copy link": "Copier le lien",
"Copy as {{target}}": "Copier en {{target}}",
"Copied to clipboard": "Copié dans le presse-papiers",
"Copyright": "Copyright",
"Create a new document": "Créer un nouveau document",
"Created at": "Créé le",
Expand Down Expand Up @@ -49,6 +51,7 @@
"Export your document, it will be inserted in the selected template.": "Exportez votre document, il sera inséré dans le modèle sélectionné.",
"Failed to add the member in the document.": "Impossible d'ajouter le membre dans le document.",
"Failed to copy link": "Échec de la copie du lien",
"Failed to copy to clipboard": "Échec de la copie dans le presse-papiers",
"Failed to create the invitation for {{email}}.": "Impossible de créer l'invitation pour {{email}}.",
"Find a member to add to the document": "Trouver un membre à ajouter au document",
"French Interministerial Directorate for Digital Affairs (DINUM), 20 avenue de Ségur 75007 Paris.": "Direction interministérielle des affaires numériques (DINUM), 20 avenue de Segur 75007 Paris.",
Expand Down