Skip to content

Commit

Permalink
refactor: TmsServiceNew devient PyramidVectorNew
Browse files Browse the repository at this point in the history
  • Loading branch information
pprev94 committed Oct 5, 2023
1 parent 8d9f5f4 commit 6923107
Show file tree
Hide file tree
Showing 17 changed files with 242 additions and 110 deletions.
52 changes: 52 additions & 0 deletions assets/components/Utils/StoredDataStatusBadge.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { FC } from "react";
import { StoredDataStatuses } from "../../types/app";
import { AlertProps } from "@codegouvfr/react-dsfr/Alert";
import Badge from "@codegouvfr/react-dsfr/Badge";
import { fr } from "@codegouvfr/react-dsfr";

type StoredDataStatusBadgeProps = {
status: string;
};

const StoredDataStatusBadge: FC<StoredDataStatusBadgeProps> = ({ status }) => {
let severity: AlertProps.Severity = "info";
let text = "";
switch (status) {
case StoredDataStatuses.GENERATED:
severity = "success";
text = "Prêt";
break;

case StoredDataStatuses.CREATED:
case StoredDataStatuses.GENERATING:
severity = "warning";
text = "En cours de génération";
break;

case StoredDataStatuses.MODIFYING:
severity = "warning";
text = "En cours de modification";
break;

case StoredDataStatuses.UNSTABLE:
severity = "error";
text = "Echoué";
break;

case StoredDataStatuses.DELETED:
severity = "info";
text = "Supprimé";
break;

default:
break;
}

return (
<Badge noIcon={true} severity={severity} className={fr.cx("fr-mr-2v")}>
{text}
</Badge>
);
};

export default StoredDataStatusBadge;
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { FC } from "react";

import { type DatasheetDetailed } from "../../../../types/app";
import VectorDbList from "./VectorDbList";
import PyramidList from "./PyramidList";

type DataListTabProps = {
datastoreId: string;
Expand All @@ -22,6 +23,11 @@ const DatasetListTab: FC<DataListTabProps> = ({ datastoreId, datasheet }) => {
<VectorDbList datastoreId={datastoreId} vectorDbList={datasheet?.vector_db_list} />
</div>
</div>
<div className={fr.cx("fr-grid-row", "fr-grid-row--center", "fr-grid-row--middle", "fr-mt-4w")}>
<div className={fr.cx("fr-col")}>
<PyramidList datastoreId={datastoreId} pyramidList={datasheet?.pyramid_list} />
</div>
</div>
</>
);
};
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import { FC } from "react";
import { Pyramid, StoredDataStatuses } from "../../../../types/app";
import { fr } from "@codegouvfr/react-dsfr";
import MenuList from "../../../../components/Utils/MenuList";
import StoredDataStatusBadge from "../../../../components/Utils/StoredDataStatusBadge";
import functions from "../../../../functions";
import Button from "@codegouvfr/react-dsfr/Button";
import { routes } from "../../../../router/router";

type PyramidListProps = {
datastoreId: string;
pyramidList: Pyramid[] | undefined;
};

const PyramidList: FC<PyramidListProps> = ({ datastoreId, pyramidList }) => {
return (
<>
<div className={fr.cx("fr-grid-row")}>
<h5>
<i className={"ri-stack-line"} />
&nbsp;Pyramides de tuiles vectorielles ({pyramidList?.length})
</h5>
</div>
{pyramidList?.map((el) => (
<div key={el._id} className={fr.cx("fr-grid-row", "fr-grid-row--middle", "fr-mt-2v")}>
<div className={fr.cx("fr-col")}>
<div className={fr.cx("fr-grid-row", "fr-grid-row--middle")}>{el.name}</div>
</div>
<div className={fr.cx("fr-col")}>
<div className={fr.cx("fr-grid-row", "fr-grid-row--right", "fr-grid-row--middle")}>
<p className={fr.cx("fr-m-auto", "fr-mr-2v")}>{el?.last_event?.date && functions.date.format(el?.last_event?.date)}</p>
<StoredDataStatusBadge status={el.status} />
<Button
onClick={() => {
routes.datastore_tms_vector_service_new({ datastoreId, pyramidId: el._id }).push();
}}
className={fr.cx("fr-mr-2v")}
disabled={el.status !== StoredDataStatuses.GENERATED}
>
Publier le service TMS
</Button>
<MenuList
menuOpenButtonProps={{
iconId: "fr-icon-menu-2-fill",
title: "Autres actions",
}}
// disabled={el.status !== StoredDataStatuses.GENERATED}
items={[
{
text: "Voir les détails",
iconId: "fr-icon-file-text-fill",
onClick: () => console.warn("Action non implémentée"),
},
{
text: "Supprimer",
iconId: "fr-icon-delete-line",
onClick: () => console.warn("Action non implémentée"),
},
]}
/>
</div>
</div>
</div>
))}
</>
);
};

export default PyramidList;
Original file line number Diff line number Diff line change
@@ -1,6 +1,4 @@
import { fr } from "@codegouvfr/react-dsfr";
import { AlertProps } from "@codegouvfr/react-dsfr/Alert";
import Badge from "@codegouvfr/react-dsfr/Badge";
import Button from "@codegouvfr/react-dsfr/Button";
import Input from "@codegouvfr/react-dsfr/Input";
import { createModal } from "@codegouvfr/react-dsfr/Modal";
Expand All @@ -15,6 +13,7 @@ import functions from "../../../../functions";
import RQKeys from "../../../../modules/RQKeys";
import { routes } from "../../../../router/router";
import { DatastoreEndpoint, StoredDataStatuses, type VectorDb } from "../../../../types/app";
import StoredDataStatusBadge from "../../../../components/Utils/StoredDataStatusBadge";

type ServiceTypes = "tms" | "wfs" | "wms-vector" | "pre-paquet";

Expand All @@ -28,47 +27,6 @@ const serviceTypeChoiceModal = createModal({
isOpenedByDefault: false,
});

const getVectorDbBadge = (status) => {
let severity: AlertProps.Severity = "info";
let text = "";
switch (status) {
case StoredDataStatuses.GENERATED:
severity = "success";
text = "Prêt";
break;

case StoredDataStatuses.CREATED:
case StoredDataStatuses.GENERATING:
severity = "warning";
text = "En cours de génération";
break;

case StoredDataStatuses.MODIFYING:
severity = "warning";
text = "En cours de modification";
break;

case StoredDataStatuses.UNSTABLE:
severity = "error";
text = "Echoué";
break;

case StoredDataStatuses.DELETED:
severity = "info";
text = "Supprimé";
break;

default:
break;
}

return (
<Badge noIcon={true} severity={severity} className={fr.cx("fr-mr-2v")}>
{text}
</Badge>
);
};

const VectorDbList: FC<VectorDbListProps> = ({ datastoreId, vectorDbList }) => {
const [serviceType, setServiceType] = useState<ServiceTypes>();
const [selectedStoredData, setSelectedStoredData] = useState<VectorDb>();
Expand Down Expand Up @@ -113,7 +71,7 @@ const VectorDbList: FC<VectorDbListProps> = ({ datastoreId, vectorDbList }) => {
if (!technicalName) {
return;
}
routes.datastore_tms_vector_service_new({ datastoreId, vectorDbId: selectedStoredData._id, technicalName }).push();
routes.datastore_pyramid_vector_new({ datastoreId, vectorDbId: selectedStoredData._id, technicalName }).push();
break;

default:
Expand Down Expand Up @@ -143,7 +101,7 @@ const VectorDbList: FC<VectorDbListProps> = ({ datastoreId, vectorDbList }) => {
<div className={fr.cx("fr-col")}>
<div className={fr.cx("fr-grid-row", "fr-grid-row--right", "fr-grid-row--middle")}>
<p className={fr.cx("fr-m-auto", "fr-mr-2v")}>{el?.last_event?.date && functions.date.format(el?.last_event?.date)}</p>
{getVectorDbBadge(el.status)}
<StoredDataStatusBadge status={el.status} />
<Button
onClick={() => {
setSelectedStoredData(el);
Expand Down
1 change: 1 addition & 0 deletions assets/pages/datasheet/DatasheetView/DatasheetView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ type DatasheetViewProps = {
datastoreId: string;
datasheetName: string;
};

const DatasheetView: FC<DatasheetViewProps> = ({ datastoreId, datasheetName }) => {
const route = useRoute();

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,13 +25,13 @@ import olDefaults from "../../../data/ol-defaults.json";
import { CartesApiException } from "../../../modules/jsonFetch";
import Wait from "../../../components/Utils/Wait";

type TmsServiceNewProps = {
type PyramidVectorNewProps = {
datastoreId: string;
vectorDbId: string;
technicalName: string;
};

const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, technicalName }) => {
const PyramidVectorNew: FC<PyramidVectorNewProps> = ({ datastoreId, vectorDbId, technicalName }) => {
const STEPS = {
TABLES_SELECTION: 1,
ATTRIBUTES_SELECTION: 2,
Expand All @@ -45,8 +45,8 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
schema[STEPS.TABLES_SELECTION] = yup.object({
selected_tables: yup
.array(yup.string())
.min(1, Translator.trans("service.tms.new.step_tables.mandatory_error"))
.required(Translator.trans("service.tms.new.step_tables.mandatory_error")),
.min(1, Translator.trans("pyramid_vector.new.step_tables.mandatory_error"))
.required(Translator.trans("pyramid_vector.new.step_tables.mandatory_error")),
});
schema[STEPS.ATTRIBUTES_SELECTION] = yup.object({
table_attributes: yup.lazy(() => {
Expand All @@ -59,15 +59,15 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
tableAttributes[table.name] = yup
.array()
.of(yup.string())
.min(1, Translator.trans("service.tms.new.step_attributes.mandatory_error"))
.required(Translator.trans("service.tms.new.step_attributes.mandatory_error"));
.min(1, Translator.trans("pyramid_vector.new.step_attributes.mandatory_error"))
.required(Translator.trans("pyramid_vector.new.step_attributes.mandatory_error"));
});
return yup.object().shape(tableAttributes);
}),
});
schema[STEPS.ZOOM_LEVELS] = yup.mixed().nullable().notRequired();
schema[STEPS.GENERALIZE_OPTIONS] = yup.object({
tippecanoe: yup.string().required(Translator.trans("service.tms.new.step_tippecanoe.mandatory_error")),
tippecanoe: yup.string().required(Translator.trans("pyramid_vector.new.step_tippecanoe.mandatory_error")),
});
schema[STEPS.SAMPLE] = yup.mixed().nullable().notRequired();

Expand Down Expand Up @@ -125,11 +125,13 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
const formatted = formatForm(technicalName, values);
formatted["vectorDbId"] = vectorDbId;

setIsSubmitting(true);

api.pyramid
.add(datastoreId, formatted)
.then(() => {
if (vectorDbQuery.data?.tags?.datasheet_name) {
routes.datastore_datasheet_view({ datastoreId, datasheetName: vectorDbQuery.data?.tags.datasheet_name, activeTab: "services" }).push();
routes.datastore_datasheet_view({ datastoreId, datasheetName: vectorDbQuery.data?.tags.datasheet_name, activeTab: "dataset" }).push();
} else {
routes.datasheet_list({ datastoreId }).push();
}
Expand All @@ -143,11 +145,11 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
};

return (
<DatastoreLayout datastoreId={datastoreId} documentTitle={Translator.trans("service.tms.new.title")}>
<h1>{Translator.trans("service.tms.new.title")}</h1>
<DatastoreLayout datastoreId={datastoreId} documentTitle={Translator.trans("pyramid_vector.new.title")}>
<h1>{Translator.trans("pyramid_vector.new.title")}</h1>

{vectorDbQuery.isLoading ? (
<LoadingText message={Translator.trans("service.tms.new.loading_stored_data")} />
<LoadingText message={Translator.trans("pyramid_vector.new.loading_stored_data")} />
) : vectorDbQuery.data === undefined ? (
<Alert
severity="error"
Expand All @@ -160,8 +162,8 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
<Stepper
currentStep={currentStep}
stepCount={Object.values(STEPS).length}
nextTitle={currentStep < STEPS.SAMPLE && Translator.trans(`service.tms.new.step${currentStep + 1}`)}
title={Translator.trans(`service.tms.new.step${currentStep}`)}
nextTitle={currentStep < STEPS.SAMPLE && Translator.trans(`pyramid_vector.new.step${currentStep + 1}`)}
title={Translator.trans(`pyramid_vector.new.step${currentStep}`)}
/>
{validationError && (
<Alert
Expand Down Expand Up @@ -203,8 +205,8 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
currentStep < Object.values(STEPS).length
? Translator.trans("continue")
: sample?.is_sample === "true"
? Translator.trans("service.tms.new.generate_sample")
: Translator.trans("service.tms.new.generate_pyramid"),
? Translator.trans("pyramid_vector.new.generate_sample")
: Translator.trans("pyramid_vector.new.generate_pyramid"),
onClick: nextStep,
},
]}
Expand All @@ -230,4 +232,4 @@ const TmsServiceNew: FC<TmsServiceNewProps> = ({ datastoreId, vectorDbId, techni
);
};

export default TmsServiceNew;
export default PyramidVectorNew;
2 changes: 1 addition & 1 deletion assets/pages/service/tms/sample/RCSampleMap.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ const RCSampleMap: FC<RCSampleMapProps> = ({ form, center, bottomZoomLevel, onCh

return (
<div className={fr.cx("fr-grid-row")}>
<p className={fr.cx("fr-mb-1w")}>{Translator.trans("service.tms.new.step_sample.sample_explain")}</p>
<p className={fr.cx("fr-mb-1w")}>{Translator.trans("pyramid_vector.new.step_sample.sample_explain")}</p>
<div className={fr.cx("fr-col-12", "fr-col-md-12")}>
<div className={"map-view"} ref={mapTargetRef} />
</div>
Expand Down
8 changes: 4 additions & 4 deletions assets/pages/service/tms/sample/Sample.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,15 +49,15 @@ const Sample: FC<SampleProps> = ({ visible, bottomZoomLevel, form }) => {

return (
<div className={fr.cx("fr-my-2v", !visible && "fr-hidden")}>
<h3>{Translator.trans("service.tms.new.step_sample.title")}</h3>
<h3>{Translator.trans("pyramid_vector.new.step_sample.title")}</h3>
<p>
<strong>{Translator.trans("service.tms.new.step_sample.doubts")}</strong>
<strong>{Translator.trans("pyramid_vector.new.step_sample.doubts")}</strong>
</p>
<p>{Translator.trans("service.tms.new.step_sample.explain")}</p>
<p>{Translator.trans("pyramid_vector.new.step_sample.explain")}</p>
<Checkbox
options={[
{
label: Translator.trans("service.tms.new.step_sample.define_sample"),
label: Translator.trans("pyramid_vector.new.step_sample.define_sample"),
nativeInputProps: {
onChange: () => toggleSample(),
},
Expand Down
4 changes: 2 additions & 2 deletions assets/pages/service/tms/tables/TableZoomLevels.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,8 @@ const TableZoomLevels: FC<TableZoomLevelsProps> = ({ visible, form, selectedTabl

return (
<div className={fr.cx("fr-my-2v", !visible && "fr-hidden")}>
<h3>{Translator.trans("service.tms.new.step_zoom_levels.title")}</h3>
<p>{Translator.trans("service.tms.new.step_zoom_levels.explain")}</p>
<h3>{Translator.trans("pyramid_vector.new.step_zoom_levels.title")}</h3>
<p>{Translator.trans("pyramid_vector.new.step_zoom_levels.explain")}</p>
{selectedTables.map((table) => (
<Accordion key={table.name} label={table.name} titleAs="h4" defaultExpanded={true}>
<ZoomRange
Expand Down
2 changes: 1 addition & 1 deletion assets/pages/service/tms/tippecanoes/Tippecanoe.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const TippeCanoe: FC<TippeCanoeProps> = ({ visible, form, state, stateRelatedMes
<div className={fr.cx("fr-my-2v", "fr-grid-row", !visible && "fr-hidden")}>
<div className={fr.cx("fr-col-12", "fr-col-md-6")}>
<RadioButtons
legend={Translator.trans("service.tms.new.step_tippecanoe.title")}
legend={Translator.trans("pyramid_vector.new.step_tippecanoe.title")}
options={Object.values(tippecanoes).map((tpc) => ({
label: <RichLabel label={tpc.label} image={`${appRoot}/${tpc.image}`} />,
hintText: tpc.explain,
Expand Down
Loading

0 comments on commit 6923107

Please sign in to comment.