diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc
index a24caf6d2c..9e5b99b980 100644
--- a/CHANGELOG.adoc
+++ b/CHANGELOG.adoc
@@ -41,6 +41,7 @@
- https://github.com/eclipse-sirius/sirius-web/issues/3550[#3550] [core] Add ExtensionRegistry merge strategy
- https://github.com/eclipse-sirius/sirius-web/issues/3557[#3550] [app] Add ProjectSettings tab extension point
- https://github.com/eclipse-sirius/sirius-web/issues/3557[#3563] [app] Improve NavigationBar extensibility
+- https://github.com/eclipse-sirius/sirius-web/issues/3557[#3587] [app] Add CreateProjectCard extension point
=== Improvements
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/application/SiriusWebApplication.tsx b/packages/sirius-web/frontend/sirius-web-application/src/application/SiriusWebApplication.tsx
index 06f623dba0..4b400bc9a9 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/application/SiriusWebApplication.tsx
+++ b/packages/sirius-web/frontend/sirius-web-application/src/application/SiriusWebApplication.tsx
@@ -53,6 +53,12 @@ import { OnboardArea } from '../onboarding/OnboardArea';
import { RepresentationContextProvider } from '../representations/RepresentationContextProvider';
import { Router } from '../router/Router';
import { siriusWebTheme as defaultTheme } from '../theme/siriusWebTheme';
+import { createProjectAreaCardExtensionPoint } from '../views/project-browser/create-projects-area/CreateProjectAreaExtensionPoints';
+import {
+ NewProjectCard,
+ ShowAllTemplatesCard,
+ UploadProjectCard,
+} from '../views/project-browser/create-projects-area/ProjectTemplateCard';
import {
ProjectSettingTabContribution,
projectSettingsTabExtensionPoint,
@@ -150,10 +156,25 @@ export const SiriusWebApplication = ({
identifier: 'sw_onboard',
Component: OnboardArea,
});
+
+ internalExtensionRegistry.addComponent(createProjectAreaCardExtensionPoint, {
+ identifier: 'sw_createProjectAreaCard_new',
+ Component: NewProjectCard,
+ });
+ internalExtensionRegistry.addComponent(createProjectAreaCardExtensionPoint, {
+ identifier: 'sw_createProjectAreaCard_upload',
+ Component: UploadProjectCard,
+ });
+ internalExtensionRegistry.addComponent(createProjectAreaCardExtensionPoint, {
+ identifier: 'sw_createProjectAreaCard_templates',
+ Component: ShowAllTemplatesCard,
+ });
+
internalExtensionRegistry.putData(workbenchViewContributionExtensionPoint, {
identifier: 'sw_workbenchView',
data: workbenchViewContributions,
});
+
internalExtensionRegistry.putData(projectSettingsTabExtensionPoint, {
identifier: 'sw_projectSettingsTab',
data: projectSettingsTabContributions,
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/index.ts b/packages/sirius-web/frontend/sirius-web-application/src/index.ts
index 2327a04be7..09010f4e2f 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/index.ts
+++ b/packages/sirius-web/frontend/sirius-web-application/src/index.ts
@@ -40,6 +40,8 @@ export {
navigationBarRightContributionExtensionPoint,
} from './navigationBar/NavigationBarExtensionPoints';
export { routerExtensionPoint } from './router/RouterExtensionPoints';
+export { type CreateProjectAreaCardProps } from './views/project-browser/create-projects-area/CreateProjectArea.types';
+export { createProjectAreaCardExtensionPoint } from './views/project-browser/create-projects-area/CreateProjectAreaExtensionPoints';
export { projectActionButtonMenuItemExtensionPoint } from './views/project-browser/list-projects-area/ProjectActionButtonExtensionPoints';
export { type ProjectRowProps } from './views/project-browser/list-projects-area/ProjectRow.types';
export { projectsTableRowExtensionPoint } from './views/project-browser/list-projects-area/ProjectsTableExtensionPoints';
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.tsx b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.tsx
index 434231c7c0..d692ceae35 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.tsx
+++ b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.tsx
@@ -11,13 +11,14 @@
* Obeo - initial API and implementation
*******************************************************************************/
+import { useComponents } from '@eclipse-sirius/sirius-components-core';
import Typography from '@material-ui/core/Typography';
import { makeStyles } from '@material-ui/core/styles';
import { useState } from 'react';
import { Redirect } from 'react-router-dom';
import { CreateProjectAreaProps, CreateProjectAreaState } from './CreateProjectArea.types';
-import { NewProjectCard, ProjectTemplateCard, ShowAllTemplatesCard, UploadProjectCard } from './ProjectTemplateCard';
-import { ProjectTemplatesModal } from './ProjectTemplatesModal';
+import { createProjectAreaCardExtensionPoint } from './CreateProjectAreaExtensionPoints';
+import { ProjectTemplateCard } from './ProjectTemplateCard';
import { redirectUrlFromTemplate } from './redirectUrlFromTemplate';
import { useCreateProjectFromTemplate } from './useCreateProjectFromTemplate';
import { useProjectTemplates } from './useProjectTemplates';
@@ -53,6 +54,7 @@ export const CreateProjectArea = ({}: CreateProjectAreaProps) => {
const { data } = useProjectTemplates(state.page, state.limit);
const projectTemplates: GQLProjectTemplate[] = data?.viewer.projectTemplates.edges.map((edge) => edge.node) ?? [];
+ const createProjectAreaCards = useComponents(createProjectAreaCardExtensionPoint);
const { createProjectFromTemplate, loading, projectCreatedFromTemplate } = useCreateProjectFromTemplate();
@@ -63,9 +65,6 @@ export const CreateProjectArea = ({}: CreateProjectAreaProps) => {
}
};
- const showAllTemplatesModal = () => setState((prevState) => ({ ...prevState, modalDisplayed: 'SHOW_ALL_TEMPLATES' }));
- const closeModal = () => setState((prevState) => ({ ...prevState, modalDisplayed: null }));
-
const redirectUrl: string | null = projectCreatedFromTemplate
? redirectUrlFromTemplate(projectCreatedFromTemplate)
: null;
@@ -89,12 +88,11 @@ export const CreateProjectArea = ({}: CreateProjectAreaProps) => {
key={template.id}
/>
))}
-
-
-
+ {createProjectAreaCards.map(({ Component: Card }, index) => (
+
+ ))}
- {state.modalDisplayed === 'SHOW_ALL_TEMPLATES' ? : null}
>
);
};
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.types.ts b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.types.ts
index 1ec34e55fa..6d90bb5d85 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.types.ts
+++ b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectArea.types.ts
@@ -15,6 +15,8 @@ import { GQLProjectTemplate } from './useProjectTemplates.types';
export interface CreateProjectAreaProps {}
+export interface CreateProjectAreaCardProps {}
+
export interface CreateProjectAreaState {
page: number;
limit: number;
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectAreaExtensionPoints.ts b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectAreaExtensionPoints.ts
new file mode 100644
index 0000000000..861ec03706
--- /dev/null
+++ b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/CreateProjectAreaExtensionPoints.ts
@@ -0,0 +1,19 @@
+/*******************************************************************************
+ * Copyright (c) 2024 Obeo.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ * Obeo - initial API and implementation
+ *******************************************************************************/
+import { ComponentExtensionPoint } from '@eclipse-sirius/sirius-components-core';
+import { CreateProjectAreaCardProps } from './CreateProjectArea.types';
+
+export const createProjectAreaCardExtensionPoint: ComponentExtensionPoint = {
+ identifier: 'createProjectArea#card',
+ FallbackComponent: () => null,
+};
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx
index aa07f9bf34..468fcad9c0 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx
+++ b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.tsx
@@ -23,9 +23,11 @@ import { makeStyles } from '@material-ui/core/styles';
import AddIcon from '@material-ui/icons/Add';
import CloudUploadOutlinedIcon from '@material-ui/icons/CloudUploadOutlined';
import MoreHorizIcon from '@material-ui/icons/MoreHoriz';
-import { useContext } from 'react';
+import { useContext, useState } from 'react';
import { Link as RouterLink } from 'react-router-dom';
-import { ProjectTemplateCardProps, ShowAllTemplatesCardProps } from './ProjectTemplateCard.types';
+import { CreateProjectAreaState } from './CreateProjectArea.types';
+import { ProjectTemplateCardProps } from './ProjectTemplateCard.types';
+import { ProjectTemplatesModal } from './ProjectTemplatesModal';
const useProjectTemplateStyles = makeStyles((theme) => ({
projectTemplateCard: {
@@ -159,22 +161,34 @@ export const UploadProjectCard = () => {
);
};
-export const ShowAllTemplatesCard = ({ onClick }: ShowAllTemplatesCardProps) => {
+export const ShowAllTemplatesCard = () => {
const classes = useProjectCardStyles();
+ const [state, setState] = useState({
+ page: 0,
+ limit: 3,
+ runningTemplate: null,
+ modalDisplayed: null,
+ });
+ const showAllTemplatesModal = () => setState((prevState) => ({ ...prevState, modalDisplayed: 'SHOW_ALL_TEMPLATES' }));
+ const closeModal = () => setState((prevState) => ({ ...prevState, modalDisplayed: null }));
return (
-
+ <>
+
+
+ {state.modalDisplayed === 'SHOW_ALL_TEMPLATES' ? : null}
+ >
);
};
diff --git a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.types.ts b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.types.ts
index aaf0b5b83f..f516e32599 100644
--- a/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.types.ts
+++ b/packages/sirius-web/frontend/sirius-web-application/src/views/project-browser/create-projects-area/ProjectTemplateCard.types.ts
@@ -19,7 +19,3 @@ export interface ProjectTemplateCardProps {
disabled: boolean;
onCreateProject: () => void;
}
-
-export interface ShowAllTemplatesCardProps {
- onClick: () => void;
-}