From 862ae7857763237c210c23a97566ca6e949dce4f Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Mon, 25 Mar 2024 15:45:40 +0100 Subject: [PATCH 001/100] feature vil-295 refacto and finalise dev --- src/components/Steps.tsx | 15 +++-- src/components/activities/StepsNavigation.tsx | 19 ++++++ .../activities/content/AddContentCard.tsx | 2 +- .../editors/TextEditor/SimpleTextEditor.tsx | 2 +- src/components/admin/NewAdminNavigation.tsx | 1 - src/hooks/useActivity.tsx | 12 ++++ src/pages/admin/newportal/contenulibre/1.tsx | 65 ++++++++----------- src/pages/admin/newportal/contenulibre/2.tsx | 30 +++------ src/pages/admin/newportal/contenulibre/3.tsx | 33 +++++----- .../admin/newportal/contenulibre/index.tsx | 33 ++-------- .../admin/newportal/contenulibre/success.tsx | 7 +- src/pages/admin/newportal/create/index.tsx | 39 +++++++++-- .../villages/create/CreerContenuLibre.tsx | 46 ------------- src/styles/editor.scss | 3 + src/styles/globals.scss | 8 ++- 15 files changed, 147 insertions(+), 168 deletions(-) create mode 100644 src/components/activities/StepsNavigation.tsx create mode 100644 src/hooks/useActivity.tsx delete mode 100644 src/pages/admin/villages/create/CreerContenuLibre.tsx diff --git a/src/components/Steps.tsx b/src/components/Steps.tsx index f5748364b..4b5bef6a3 100644 --- a/src/components/Steps.tsx +++ b/src/components/Steps.tsx @@ -11,9 +11,12 @@ import Stepper from '@mui/material/Stepper'; import { ActivityContext } from 'src/contexts/activityContext'; import { primaryColor, primaryColorLight2, successColor, warningColor } from 'src/styles/variables.const'; -const StepIcon = ({ icon, active, completed, error, onClick }: StepIconProps) => { +const StepIcon = React.forwardRef((props, ref) => { + const { icon, active, completed, error } = props; + return (
borderRadius: '50%', border: completed ? (error ? `1px solid ${warningColor}` : `1px solid ${successColor}`) : `1px solid ${primaryColor}`, }} - className={onClick !== undefined ? 'background-hover' : ''} - onClick={onClick} + className={props.onClick ? 'background-hover' : ''} + onClick={props.onClick} > {completed && !error ? : icon}
); -}; +}); + +StepIcon.displayName = 'StepIcon'; + +export default StepIcon; interface StepsProps { steps: string[]; diff --git a/src/components/activities/StepsNavigation.tsx b/src/components/activities/StepsNavigation.tsx new file mode 100644 index 000000000..a5808f64b --- /dev/null +++ b/src/components/activities/StepsNavigation.tsx @@ -0,0 +1,19 @@ +import React from 'react'; + +import { Steps } from 'src/components/Steps'; + +interface StepsNavigationProps { + currentStep: number; + errorSteps?: number[]; +} + +const StepsNavigation: React.FC = ({ currentStep, errorSteps }) => ( + +); + +export default StepsNavigation; diff --git a/src/components/activities/content/AddContentCard.tsx b/src/components/activities/content/AddContentCard.tsx index 1b5edec1c..0ceffd3c3 100644 --- a/src/components/activities/content/AddContentCard.tsx +++ b/src/components/activities/content/AddContentCard.tsx @@ -21,7 +21,7 @@ export const AddContentCard = ({ addContent = () => {} }: AddContentCardProps) = return ( -
+
Ajouter à votre description : diff --git a/src/components/activities/content/editors/TextEditor/SimpleTextEditor.tsx b/src/components/activities/content/editors/TextEditor/SimpleTextEditor.tsx index ff616945a..2b840a2f1 100644 --- a/src/components/activities/content/editors/TextEditor/SimpleTextEditor.tsx +++ b/src/components/activities/content/editors/TextEditor/SimpleTextEditor.tsx @@ -52,7 +52,7 @@ interface SimpleTextEditorProps { export const SimpleTextEditor = ({ value = '', - placeholder = 'Commencez à écrire ici, ou ajoutez une vidéo ou une image.', + placeholder = 'Commencez à écrire ici, ou ajoutez une vidéo, un son ou une image.', onChange = () => {}, onFocus = () => {}, onBlur = () => {}, diff --git a/src/components/admin/NewAdminNavigation.tsx b/src/components/admin/NewAdminNavigation.tsx index 2c7a8db53..286514b71 100644 --- a/src/components/admin/NewAdminNavigation.tsx +++ b/src/components/admin/NewAdminNavigation.tsx @@ -11,7 +11,6 @@ import PublierIcon from 'src/svg/publier.svg'; interface NavItemProps { key?: number; - path: string; selected: boolean; onClick: React.MouseEventHandler; diff --git a/src/hooks/useActivity.tsx b/src/hooks/useActivity.tsx new file mode 100644 index 000000000..79f21f16a --- /dev/null +++ b/src/hooks/useActivity.tsx @@ -0,0 +1,12 @@ +// hooks/useActivity.js +import React from 'react'; + +import { ActivityContext } from 'src/contexts/activityContext'; + +export function useActivity() { + const context = React.useContext(ActivityContext); + if (context === undefined) { + throw new Error('useActivity must be used within an ActivityProvider'); + } + return context; +} diff --git a/src/pages/admin/newportal/contenulibre/1.tsx b/src/pages/admin/newportal/contenulibre/1.tsx index c94ced779..e908b54b0 100644 --- a/src/pages/admin/newportal/contenulibre/1.tsx +++ b/src/pages/admin/newportal/contenulibre/1.tsx @@ -1,23 +1,18 @@ import { useRouter } from 'next/router'; -import React from 'react'; +import React, { useEffect } from 'react'; import { isFreeContent } from 'src/activity-types/anyActivity'; -import { Base } from 'src/components/Base'; -import { Steps } from 'src/components/Steps'; import { StepsButton } from 'src/components/StepsButtons'; -import { ContentEditor } from 'src/components/activities/content'; -import { BackButton } from 'src/components/buttons/BackButton'; -import { ActivityContext } from 'src/contexts/activityContext'; +import StepsNavigation from 'src/components/activities/StepsNavigation'; +import ContentEditor from 'src/components/activities/content/ContentEditor'; +import { useActivity } from 'src/hooks/useActivity'; import type { ActivityContent } from 'types/activity.type'; -import { ActivityStatus } from 'types/activity.type'; -const ContenuLibre = () => { +const ContenuLibreStep1: React.FC = () => { + const { activity, updateActivity, addContent, deleteContent, save } = useActivity(); const router = useRouter(); - const { activity, updateActivity, addContent, deleteContent, save } = React.useContext(ActivityContext); - const isEdit = activity !== null && activity.status !== ActivityStatus.DRAFT; - - React.useEffect(() => { + useEffect(() => { if (activity === null && !('activity-id' in router.query) && !sessionStorage.getItem('activity')) { router.push('/admin/newportal/contenulibre'); } else if (activity && !isFreeContent(activity)) { @@ -26,42 +21,34 @@ const ContenuLibre = () => { }, [activity, router]); const updateContent = (content: ActivityContent[]): void => { - if (!activity) { - return; - } + if (!activity) return; updateActivity({ content }); }; - const onNext = () => { - save().catch(console.error); - router.push('/admin/newportal/contenulibre/2'); + const onNext = async (): Promise => { + const success = await save(); + if (success) { + router.push('/admin/newportal/contenulibre/2'); + } }; if (!activity) { - return ; + return
Loading...
; } return ( - -
- {!isEdit && } - -
-

Ecrivez le contenu de votre publication

-

- Utilisez l'éditeur de bloc pour définir le contenu de votre publication. Dans l'étape 2 vous pourrez définir l'aspect de la - carte résumée de votre publication. -

- - -
-
- +
+ +

Ecrivez le contenu de votre publication

+

+ Utilisez l'éditeur de bloc pour définir le contenu de votre publication. Dans l'étape 2 vous pourrez définir l'aspect de la + carte résumée de votre publication. +

+ + + +
); }; -export default ContenuLibre; +export default ContenuLibreStep1; diff --git a/src/pages/admin/newportal/contenulibre/2.tsx b/src/pages/admin/newportal/contenulibre/2.tsx index 66cdb25d1..429b803b5 100644 --- a/src/pages/admin/newportal/contenulibre/2.tsx +++ b/src/pages/admin/newportal/contenulibre/2.tsx @@ -9,43 +9,36 @@ import { getImage } from 'src/activity-types/freeContent.constants'; import type { FreeContentData } from 'src/activity-types/freeContent.types'; import { Base } from 'src/components/Base'; import { Modal } from 'src/components/Modal'; -import { Steps } from 'src/components/Steps'; import { StepsButton } from 'src/components/StepsButtons'; import { ActivityCard } from 'src/components/activities/ActivityCard'; +import StepsNavigation from 'src/components/activities/StepsNavigation'; import { ImageModal } from 'src/components/activities/content/editors/ImageEditor/ImageModal'; import { LightBox } from 'src/components/lightbox/Lightbox'; -import { ActivityContext } from 'src/contexts/activityContext'; import { UserContext } from 'src/contexts/userContext'; +import { useActivity } from 'src/hooks/useActivity'; import { primaryColor } from 'src/styles/variables.const'; const ContenuLibre = () => { const router = useRouter(); - const { activity, updateActivity, save } = React.useContext(ActivityContext); + const { activity, updateActivity, save } = useActivity(); const { user } = React.useContext(UserContext); const [selectedImageUrl, setSelectedImageUrl] = React.useState(undefined); const [isAllImagesModalOpen, setIsAllImagesModalOpen] = React.useState(false); const [isImageModalOpen, setIsImageModalOpen] = React.useState(false); const data = (activity?.data as FreeContentData) || null; - const errorSteps = React.useMemo(() => { - if (activity !== null && activity.content.filter((c) => c.value.length > 0 && c.value !== '

\n').length === 0) { - return [0]; - } - return []; - }, [activity]); + const hasContentImages = React.useMemo(() => activity !== null && activity.content.some((c) => c.type === 'image'), [activity]); const imageUrl = React.useMemo(() => getImage(activity?.content ?? [], data), [activity, data]); React.useEffect(() => { - if (activity === null && !('activity-id' in router.query) && !sessionStorage.getItem('activity')) { - router.push('/admin/newportal/contenulibre/1'); - } else if (activity && !isFreeContent(activity)) { + if (!activity || !isFreeContent(activity)) { router.push('/admin/newportal/contenulibre/1'); } }, [activity, router]); if (!activity || !user) { - return ; + return ; } const handlePinnedChange = () => { @@ -68,14 +61,9 @@ const ContenuLibre = () => { }; return ( - +
- +

Ajustez l'apparence de votre publication

@@ -233,7 +221,7 @@ const ContenuLibre = () => { setSelectedImageUrl(undefined); }} /> - +

); }; diff --git a/src/pages/admin/newportal/contenulibre/3.tsx b/src/pages/admin/newportal/contenulibre/3.tsx index 725da1cad..bf4f83171 100644 --- a/src/pages/admin/newportal/contenulibre/3.tsx +++ b/src/pages/admin/newportal/contenulibre/3.tsx @@ -10,18 +10,18 @@ import CircularProgress from '@mui/material/CircularProgress'; import { isFreeContent } from 'src/activity-types/anyActivity'; import type { FreeContentData } from 'src/activity-types/freeContent.types'; import { Base } from 'src/components/Base'; -import { Steps } from 'src/components/Steps'; import { StepsButton } from 'src/components/StepsButtons'; import { ActivityCard } from 'src/components/activities/ActivityCard'; +import StepsNavigation from 'src/components/activities/StepsNavigation'; import { ContentView } from 'src/components/activities/content/ContentView'; import { EditButton } from 'src/components/buttons/EditButton'; -import { ActivityContext } from 'src/contexts/activityContext'; import { UserContext } from 'src/contexts/userContext'; +import { useActivity } from 'src/hooks/useActivity'; import { ActivityStatus } from 'types/activity.type'; const ContenuLibre = () => { const router = useRouter(); - const { activity, save } = React.useContext(ActivityContext); + const { activity, save } = useActivity(); const { user } = React.useContext(UserContext); const [isLoading, setIsLoading] = React.useState(false); @@ -40,19 +40,21 @@ const ContenuLibre = () => { const isValid = errorSteps.length === 0; React.useEffect(() => { - if (activity === null && !('activity-id' in router.query) && !sessionStorage.getItem('activity')) { + if (!activity) { router.push('/admin/newportal/contenulibre'); - } else if (activity && !isFreeContent(activity)) { + return; + } + if (!isFreeContent(activity)) { router.push('/admin/newportal/contenulibre'); } }, [activity, router]); - const onPublish = async () => { + const onCreate = async () => { if (!isValid) { return; } setIsLoading(true); - const { success } = await save(true); + const { success } = await save(false); if (success) { router.push('/admin/newportal/contenulibre/success'); } @@ -64,14 +66,9 @@ const ContenuLibre = () => { } return ( - +
- +

Pré-visualisez votre publication

@@ -87,14 +84,14 @@ const ContenuLibre = () => { {"Modifier à l'étape précédente"} -

) : (
-
)} @@ -129,7 +126,7 @@ const ContenuLibre = () => { - +
); }; diff --git a/src/pages/admin/newportal/contenulibre/index.tsx b/src/pages/admin/newportal/contenulibre/index.tsx index 130f9979e..7954c4e77 100644 --- a/src/pages/admin/newportal/contenulibre/index.tsx +++ b/src/pages/admin/newportal/contenulibre/index.tsx @@ -2,20 +2,13 @@ import Link from 'next/link'; import { useRouter } from 'next/router'; import React from 'react'; -import { Base } from 'src/components/Base'; -import { StepsButton } from 'src/components/StepsButtons'; -import { ActivityContext } from 'src/contexts/activityContext'; +import ContenuLibreStep1 from './1'; import { UserContext } from 'src/contexts/userContext'; -import { VillageContext } from 'src/contexts/villageContext'; import BackArrow from 'src/svg/back-arrow.svg'; -import { ActivityType } from 'types/activity.type'; import { UserType } from 'types/user.type'; const ContenuLibre = () => { - const router = useRouter(); - const { createNewActivity } = React.useContext(ActivityContext); const { user } = React.useContext(UserContext); - const { selectedPhase } = React.useContext(VillageContext); const isModerator = user !== null && user.type <= UserType.MEDIATOR; @@ -41,30 +34,18 @@ const ContenuLibre = () => { ); }; - const onNext = () => { - const success = createNewActivity(ActivityType.CONTENU_LIBRE, selectedPhase); - if (success) { - router.push('/admin/newportal/contenulibre/1'); - } - }; - if (!isModerator) { return

Vous n'avez pas accès à cette page, vous devez être modérateur.

; } return ( - -
-
- {backButton()} -

- Dans cette activité, nous vous proposons de créer une publication libre. Vous pourrez ensuite partager cette publication et décider de - l'épingler dans le fil d'actualité. -

- -
+
+
+ {backButton()} +

Un contenu libre est une activité publiée dans le fil d’activité par Pélico

+
- +
); }; diff --git a/src/pages/admin/newportal/contenulibre/success.tsx b/src/pages/admin/newportal/contenulibre/success.tsx index 09d0f64ea..90d3e3e0a 100644 --- a/src/pages/admin/newportal/contenulibre/success.tsx +++ b/src/pages/admin/newportal/contenulibre/success.tsx @@ -3,16 +3,15 @@ import React from 'react'; import { Button } from '@mui/material'; -import { Base } from 'src/components/Base'; import { bgPage } from 'src/styles/variables.const'; import PelicoSouriant from 'src/svg/pelico/pelico-souriant.svg'; const FreeContentSuccess = () => { return ( - +
-

Votre publication a bien été publiée !

+

Votre publication a bien été créée !

@@ -23,7 +22,7 @@ const FreeContentSuccess = () => {
- +
); }; diff --git a/src/pages/admin/newportal/create/index.tsx b/src/pages/admin/newportal/create/index.tsx index 05e503212..8ddab9aed 100644 --- a/src/pages/admin/newportal/create/index.tsx +++ b/src/pages/admin/newportal/create/index.tsx @@ -1,31 +1,60 @@ import Link from 'next/link'; +import { useRouter } from 'next/router'; import React from 'react'; import { List, ListItem, ListItemIcon, ListItemText } from '@mui/material'; +import { VillageContext } from 'src/contexts/villageContext'; +import { useActivity } from 'src/hooks/useActivity'; import DoubleChevronRightIcon from 'src/svg/mdi-light_chevron-double-right.svg'; +import { ActivityType } from 'types/activity.type'; type Link = { name: string; link: string; + action?: () => void; }; interface NavItemProps { key?: number; link: string; primary: string; + action?: (() => void) | undefined; } const Creer = () => { + const router = useRouter(); + const { createNewActivity } = useActivity(); + const { selectedPhase } = React.useContext(VillageContext); + + const handleNewActivity = () => { + const success = createNewActivity(ActivityType.CONTENU_LIBRE, selectedPhase); + if (success) { + router.push('/admin/newportal/contenulibre/1'); + } + }; + const links: Link[] = [ - { name: 'Créer du contenu libre', link: '/admin/newportal/contenulibre' }, + { name: 'Créer du contenu libre', link: '/admin/newportal/contenulibre', action: handleNewActivity }, { name: 'Créer une activité H5P', link: 'https://' }, { name: 'Paramétrer l’hymne', link: 'https://' }, { name: 'Mixer l’hymne', link: 'https://' }, ]; - const NavItem = ({ link, primary }: NavItemProps) => ( - - + const NavItem = ({ link, primary, action }: NavItemProps) => ( + + { + e.preventDefault(); + action(); + } + : undefined + } + > @@ -51,7 +80,7 @@ const Creer = () => { links && ( {links?.map((item, id) => ( - + ))} ) diff --git a/src/pages/admin/villages/create/CreerContenuLibre.tsx b/src/pages/admin/villages/create/CreerContenuLibre.tsx deleted file mode 100644 index 88dd70c69..000000000 --- a/src/pages/admin/villages/create/CreerContenuLibre.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import React from 'react'; - -import { Stepper, Step, StepLabel, Box } from '@mui/material'; - -import BackArrow from 'src/svg/back-arrow.svg'; - -interface CreerContenuLibreProps { - onBackClick?: (() => void) | undefined; -} - -const CreerContenuLibre = ({ onBackClick }: CreerContenuLibreProps) => { - const steps = ['Contenu', 'Forme', 'Pré-visualiser']; - - const renderClickableTitle = () => ( -
- -

Créer du contenu libre

-
- ); - - const renderDescription = () =>

Un contenu libre est une activité publiée dans le fil d’activité par Pélico

; - - const renderSteps = () => { - return ( - - - {steps.map((label) => ( - - {label} - - ))} - - - ); - }; - - return ( -
- {renderClickableTitle()} - {renderDescription()} - {renderSteps()} -
- ); -}; - -export default CreerContenuLibre; diff --git a/src/styles/editor.scss b/src/styles/editor.scss index bd8859222..23227f5c2 100644 --- a/src/styles/editor.scss +++ b/src/styles/editor.scss @@ -85,6 +85,9 @@ &--without-min-height { min-height: unset; + @media screen and (max-width: 1200px) { + min-height: 6rem; + } } } diff --git a/src/styles/globals.scss b/src/styles/globals.scss index ef6a88c99..abbde6ef3 100644 --- a/src/styles/globals.scss +++ b/src/styles/globals.scss @@ -86,7 +86,7 @@ body { width: 100%; height: auto; margin-bottom: 20px; - padding: 0; + padding: 15px !important; .like-button.blue { margin-left: auto; margin-right: auto; @@ -98,7 +98,7 @@ body { margin: 0 !important; } ul { - padding: 0 25px; + padding: 0; } } } @@ -343,6 +343,10 @@ a.text--success:hover { color: $warning-color !important; font-weight: 500; } + & div:first-child { + left: 0 !important; + right: 0 !important; + } } .width-900 { From c1aa985fee68d81172f84fb3f6450d796c306488 Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Mon, 25 Mar 2024 15:48:41 +0100 Subject: [PATCH 002/100] feature vil-295 refacto and finalise devs --- src/pages/admin/newportal/contenulibre/1.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/admin/newportal/contenulibre/1.tsx b/src/pages/admin/newportal/contenulibre/1.tsx index e908b54b0..23e4fbdbe 100644 --- a/src/pages/admin/newportal/contenulibre/1.tsx +++ b/src/pages/admin/newportal/contenulibre/1.tsx @@ -2,6 +2,7 @@ import { useRouter } from 'next/router'; import React, { useEffect } from 'react'; import { isFreeContent } from 'src/activity-types/anyActivity'; +import { Base } from 'src/components/Base'; import { StepsButton } from 'src/components/StepsButtons'; import StepsNavigation from 'src/components/activities/StepsNavigation'; import ContentEditor from 'src/components/activities/content/ContentEditor'; @@ -33,7 +34,7 @@ const ContenuLibreStep1: React.FC = () => { }; if (!activity) { - return
Loading...
; + return ; } return ( From a1c872904c2731632bbf9ca8d9f144d76f45a1e7 Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Mon, 25 Mar 2024 16:05:54 +0100 Subject: [PATCH 003/100] fix error HTMLELEMENT is not defined --- src/components/Sortable.tsx | 48 +++++++++++++++++++------------------ 1 file changed, 25 insertions(+), 23 deletions(-) diff --git a/src/components/Sortable.tsx b/src/components/Sortable.tsx index 9b98bb469..cdc064a16 100644 --- a/src/components/Sortable.tsx +++ b/src/components/Sortable.tsx @@ -31,29 +31,31 @@ export const Sortable = ({ list, setList = () => {}, han // On component mount, init sortableJs. React.useEffect(() => { - if (elRef.current) { - const sort = SortableJS.create(elRef.current, { - handle, - draggable: '>*', - chosenClass: 'sortable-chosen', - ghostClass: 'sortable-ghost', - onUpdate: (event) => { - if (!event || event.oldIndex === undefined || event.newIndex === undefined) { - return; - } - const newList = [...listRef.current]; - const newIndex = event.newIndex; - const oldIndex = event.oldIndex; - if (oldIndex >= newList.length || newIndex >= newList.length) { - return; - } - newList.splice(newIndex, 0, newList.splice(oldIndex, 1)[0]); - setListRef.current(newList); - }, - }); - return () => { - sort.destroy(); - }; + if (typeof window !== 'undefined' && elRef.current) { + if (elRef.current) { + const sort = SortableJS.create(elRef.current, { + handle, + draggable: '>*', + chosenClass: 'sortable-chosen', + ghostClass: 'sortable-ghost', + onUpdate: (event) => { + if (!event || event.oldIndex === undefined || event.newIndex === undefined) { + return; + } + const newList = [...listRef.current]; + const newIndex = event.newIndex; + const oldIndex = event.oldIndex; + if (oldIndex >= newList.length || newIndex >= newList.length) { + return; + } + newList.splice(newIndex, 0, newList.splice(oldIndex, 1)[0]); + setListRef.current(newList); + }, + }); + return () => { + sort.destroy(); + }; + } } return () => {}; }, [handle]); From d6f4e922f60245e8c550353b9a033c04c0b61218 Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Mon, 25 Mar 2024 16:13:36 +0100 Subject: [PATCH 004/100] fix error --- src/pages/admin/newportal/create/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/admin/newportal/create/index.tsx b/src/pages/admin/newportal/create/index.tsx index 8ddab9aed..184068d9d 100644 --- a/src/pages/admin/newportal/create/index.tsx +++ b/src/pages/admin/newportal/create/index.tsx @@ -29,7 +29,7 @@ const Creer = () => { const handleNewActivity = () => { const success = createNewActivity(ActivityType.CONTENU_LIBRE, selectedPhase); if (success) { - router.push('/admin/newportal/contenulibre/1'); + router.push('/admin/newportal/contenulibre'); } }; From 34b3ff9d30eb228181d30be1202903adda0a8b72 Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Mon, 25 Mar 2024 16:19:01 +0100 Subject: [PATCH 005/100] rollback steps --- src/components/Steps.tsx | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/src/components/Steps.tsx b/src/components/Steps.tsx index 4b5bef6a3..f5748364b 100644 --- a/src/components/Steps.tsx +++ b/src/components/Steps.tsx @@ -11,12 +11,9 @@ import Stepper from '@mui/material/Stepper'; import { ActivityContext } from 'src/contexts/activityContext'; import { primaryColor, primaryColorLight2, successColor, warningColor } from 'src/styles/variables.const'; -const StepIcon = React.forwardRef((props, ref) => { - const { icon, active, completed, error } = props; - +const StepIcon = ({ icon, active, completed, error, onClick }: StepIconProps) => { return (
((props, ref) => borderRadius: '50%', border: completed ? (error ? `1px solid ${warningColor}` : `1px solid ${successColor}`) : `1px solid ${primaryColor}`, }} - className={props.onClick ? 'background-hover' : ''} - onClick={props.onClick} + className={onClick !== undefined ? 'background-hover' : ''} + onClick={onClick} > {completed && !error ? : icon}
); -}); - -StepIcon.displayName = 'StepIcon'; - -export default StepIcon; +}; interface StepsProps { steps: string[]; From 146ee20c76870a7c6acda3706731d5edc448943d Mon Sep 17 00:00:00 2001 From: GuillaumeLoup Date: Tue, 26 Mar 2024 09:30:30 +0100 Subject: [PATCH 006/100] fix error --- public/h5p/editor/scripts/h5peditor-editor.js | 186 +++++++++--------- src/pages/admin/newportal/contenulibre/1.tsx | 2 +- src/pages/admin/newportal/contenulibre/2.tsx | 2 +- src/pages/admin/newportal/contenulibre/3.tsx | 2 +- 4 files changed, 97 insertions(+), 95 deletions(-) diff --git a/public/h5p/editor/scripts/h5peditor-editor.js b/public/h5p/editor/scripts/h5peditor-editor.js index bcfa90d8f..386502f3f 100644 --- a/public/h5p/editor/scripts/h5peditor-editor.js +++ b/public/h5p/editor/scripts/h5peditor-editor.js @@ -15,24 +15,24 @@ ns.Editor = function (library, defaultParams, replace, iframeLoaded) { // Library may return "0", make sure this doesn't return true in checks library = library && library != 0 ? library : ''; - - // Define iframe DOM Element through jQuery - var $iframe = ns.$('