Skip to content

Commit

Permalink
delete dataset, placeholder changes improvement
Browse files Browse the repository at this point in the history
  • Loading branch information
mluena committed Sep 3, 2024
1 parent 206f188 commit 63dd245
Show file tree
Hide file tree
Showing 8 changed files with 140 additions and 52 deletions.
26 changes: 20 additions & 6 deletions client/src/components/forms/dataset/colors.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,11 @@ export default function DatasetColorsForm({
};

const handleDelete = useCallback(() => {
mutateDeleteDatasetsId({ id: +id });
if (datasetDataPendingToApprove?.data?.id) {
mutateDeleteDatasetEditSuggestionsId({ id: +datasetId });
} else {
mutateDeleteDatasetsId({ id: +datasetId });
}
}, [mutateDeleteDatasetsId, id]);

const handleSubmit = useCallback(
Expand Down Expand Up @@ -328,7 +332,9 @@ export default function DatasetColorsForm({
id="color"
value={field.value}
className={cn({
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(
field.name,
),
})}
onChange={(e) => {
return field.onChange(e.target.value);
Expand Down Expand Up @@ -356,7 +362,9 @@ export default function DatasetColorsForm({
id="color"
value={field.value}
className={cn({
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(
field.name,
),
})}
onChange={(e) => {
return field.onChange(e.target.value);
Expand All @@ -381,7 +389,9 @@ export default function DatasetColorsForm({
id="color"
value={field.value}
className={cn({
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(
field.name,
),
})}
onChange={(e) => {
return field.onChange(e.target.value);
Expand Down Expand Up @@ -410,7 +420,9 @@ export default function DatasetColorsForm({
id="color"
value={field.value}
className={cn({
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(
field.name,
),
})}
onChange={(e) => {
return field.onChange(e.target.value);
Expand All @@ -435,7 +447,9 @@ export default function DatasetColorsForm({
id="color"
value={field.value}
className={cn({
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(
field.name,
),
})}
onChange={(e) => {
return field.onChange(e.target.value);
Expand Down
75 changes: 54 additions & 21 deletions client/src/components/forms/dataset/data.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

import { useCallback, useMemo } from "react";

import { toast } from "react-toastify";
import { useForm } from "react-hook-form";

import { useRouter, useParams } from "next/navigation";
Expand Down Expand Up @@ -61,7 +62,11 @@ import { DATA_COLUMNS_TYPE } from "./constants";
import { getFormSchema } from "./data-form-schema";
import type { VALUE_TYPE, Data, DatasetValuesCSV } from "./types";
import DashboardFormWrapper from "./wrapper";
import { useGetDatasetEditSuggestionsId } from "@/types/generated/dataset-edit-suggestion";
import {
useDeleteDatasetEditSuggestionsId,
useGetDatasetEditSuggestionsId,
} from "@/types/generated/dataset-edit-suggestion";
import { useDeleteDatasetsId } from "@/types/generated/dataset";

// Types for deep nested objects function
type ParamType = "link_url" | "description" | "link_title";
Expand Down Expand Up @@ -100,8 +105,6 @@ export default function DatasetDataForm({
const { id: datasetId } = params;
const editedSuggestionData = useGetDatasetEditSuggestionsId(+datasetId);

const { id: datasetID } = params;

const { data: session } = useSession();
const user = session?.user;
const { data: meData } = useGetUsersId(`${user?.id}`, {
Expand All @@ -114,7 +117,7 @@ export default function DatasetDataForm({
const { data: datasetValuesData } = useGetDatasetValues(
{
filters: {
dataset: datasetID,
dataset: datasetId,
},
"pagination[pageSize]": 300,
populate: {
Expand Down Expand Up @@ -232,6 +235,34 @@ export default function DatasetDataForm({
values,
});

const { mutate: mutateDeleteDatasetsId } = useDeleteDatasetsId({
mutation: {
onSuccess: (data) => {
console.info("Success deleting dataset:", data);
toast.success("Dataset deleted");
push(`/dashboard`);
},
onError: (error) => {
toast.error("Error deleting dataset");
console.error("Error deleting dataset:", error);
},
},
});

const { mutate: mutateDeleteDatasetEditSuggestionsId } = useDeleteDatasetEditSuggestionsId({
mutation: {
onSuccess: (data) => {
console.info("Success deleting suggested dataset:", data);
toast.success("Success deleting suggested dataset");
push(`/dashboard`);
},
onError: (error) => {
toast.error("Error deleting suggested dataset");
console.error("Error deleting suggested dataset :", error);
},
},
});

const COLUMNS = DATA_COLUMNS_TYPE[rawData.settings.value_type as VALUE_TYPE];

const handleCancel = () => {
Expand Down Expand Up @@ -290,6 +321,14 @@ export default function DatasetDataForm({
[onSubmit],
);

const handleDelete = useCallback(() => {
if (datasetId) {
mutateDeleteDatasetEditSuggestionsId({ id: +datasetId });
} else {
mutateDeleteDatasetsId({ id: +datasetId });
}
}, [mutateDeleteDatasetsId, id]);

const checkChanges = useCallback(
(field: Field, index: number, param: ParamType) => {
return changes?.find(
Expand All @@ -313,6 +352,7 @@ export default function DatasetDataForm({
title={title}
isNew={isDatasetNew}
handleCancel={handleCancel}
handleDelete={handleDelete}
status={rawData.settings.review_status}
/>
)}
Expand Down Expand Up @@ -395,11 +435,8 @@ export default function DatasetDataForm({
className={cn({
"h-9 border-none bg-gray-300/20 placeholder:text-gray-300/95":
true,
"bg-green-400": checkChanges(
field,
index,
"link_title",
),
"bg-green-400 placeholder:text-gray-400":
checkChanges(field, index, "link_title"),
})}
disabled={
status === "declined" &&
Expand Down Expand Up @@ -443,11 +480,8 @@ export default function DatasetDataForm({
className={cn({
"h-9 border-none bg-gray-300/20 placeholder:text-gray-300/95":
true,
"bg-green-400": checkChanges(
field,
index,
"link_title",
),
"bg-green-400 placeholder:text-gray-400":
checkChanges(field, index, "link_title"),
})}
disabled={
status === "declined" &&
Expand Down Expand Up @@ -491,11 +525,8 @@ export default function DatasetDataForm({
className={cn({
"h-9 border-none bg-gray-300/20 placeholder:text-gray-300/95":
true,
"bg-green-400": checkChanges(
field,
index,
"link_title",
),
"bg-green-400 placeholder:text-gray-400":
checkChanges(field, index, "link_title"),
})}
disabled={
status === "declined" &&
Expand Down Expand Up @@ -561,7 +592,8 @@ export default function DatasetDataForm({
className={cn({
"h-9 border-none bg-gray-300/20 placeholder:text-gray-300/95":
true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400":
changes?.includes(field.name),
})}
/>
)}
Expand All @@ -578,7 +610,8 @@ export default function DatasetDataForm({
className={cn({
"h-9 border-none bg-gray-300/20 placeholder:text-gray-300/95":
true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400":
changes?.includes(field.name),
})}
/>
)}
Expand Down
53 changes: 48 additions & 5 deletions client/src/components/forms/dataset/settings.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@

import { useCallback } from "react";

import { toast } from "react-toastify";
import { useForm } from "react-hook-form";

import { useRouter } from "next/navigation";
import { useRouter, useParams } from "next/navigation";

import { zodResolver } from "@hookform/resolvers/zod";
import { useSetAtom } from "jotai";
Expand Down Expand Up @@ -51,6 +52,8 @@ import {

import { VALUE_TYPE_DICTIONARY } from "./constants";
import DashboardFormWrapper from "./wrapper";
import { useDeleteDatasetsId } from "@/types/generated/dataset";
import { useDeleteDatasetEditSuggestionsId } from "@/types/generated/dataset-edit-suggestion";

export default function DatasetSettingsForm({
title,
Expand Down Expand Up @@ -82,6 +85,9 @@ export default function DatasetSettingsForm({

const isDatasetNew = isEmpty(data);

const params = useParams();
const { id: datasetId } = params;

const { data: categoriesData } = useGetCategories(GET_CATEGORIES_OPTIONS(), {
query: {
select: (data) =>
Expand All @@ -92,6 +98,34 @@ export default function DatasetSettingsForm({
},
});

const { mutate: mutateDeleteDatasetsId } = useDeleteDatasetsId({
mutation: {
onSuccess: (data) => {
console.info("Success deleting dataset:", data);
toast.success("Dataset deleted");
push(`/dashboard`);
},
onError: (error) => {
toast.error("Error deleting dataset");
console.error("Error deleting dataset:", error);
},
},
});

const { mutate: mutateDeleteDatasetEditSuggestionsId } = useDeleteDatasetEditSuggestionsId({
mutation: {
onSuccess: (data) => {
console.info("Success deleting suggested dataset:", data);
toast.success("Success deleting suggested dataset");
push(`/dashboard`);
},
onError: (error) => {
toast.error("Error deleting suggested dataset");
console.error("Error deleting suggested dataset :", error);
},
},
});

const value_types = ["text", "number", "boolean", "resource"] as const;
const valueTypesOptions = value_types.map((type) => ({
label: VALUE_TYPE_DICTIONARY[type],
Expand Down Expand Up @@ -166,6 +200,14 @@ export default function DatasetSettingsForm({
[onSubmit, data],
);

const handleDelete = useCallback(() => {
if (isDatasetNew) {
mutateDeleteDatasetEditSuggestionsId({ id: +datasetId });
} else {
mutateDeleteDatasetsId({ id: +datasetId });
}
}, [mutateDeleteDatasetsId, datasetId]);

return (
<>
{header && (
Expand All @@ -174,6 +216,7 @@ export default function DatasetSettingsForm({
title={title}
isNew={isDatasetNew}
handleCancel={handleCancel}
handleDelete={handleDelete}
status={data.review_status}
/>
)}
Expand All @@ -198,7 +241,7 @@ export default function DatasetSettingsForm({
value={field.value}
className={cn({
"border-none bg-gray-300/20 placeholder:text-gray-300/95": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
placeholder="Name"
disabled={status === "declined" && ME_DATA?.role?.type !== "admin"}
Expand All @@ -221,7 +264,7 @@ export default function DatasetSettingsForm({
<SelectTrigger
className={cn({
"h-10 w-full border-0 bg-gray-300/20": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
disabled={status === "declined" && ME_DATA?.role?.type !== "admin"}
>
Expand Down Expand Up @@ -253,7 +296,7 @@ export default function DatasetSettingsForm({
<SelectTrigger
className={cn({
"h-10 w-full border-0 bg-gray-300/20": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
disabled={status === "declined" && ME_DATA?.role?.type !== "admin"}
>
Expand Down Expand Up @@ -288,7 +331,7 @@ export default function DatasetSettingsForm({
value={field.value}
className={cn({
"border-none bg-gray-300/20 placeholder:text-gray-300/95": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
placeholder="unit"
disabled={status === "declined" && ME_DATA?.role?.type !== "admin"}
Expand Down
8 changes: 4 additions & 4 deletions client/src/containers/collaborators/form/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -397,7 +397,7 @@ export default function CollaboratorForm() {
value={field.value}
className={cn({
"border-none bg-gray-300/20 placeholder:text-gray-300/95": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
placeholder="Name"
disabled={
Expand All @@ -423,7 +423,7 @@ export default function CollaboratorForm() {
<SelectTrigger
className={cn({
"h-10 w-full border-0 bg-gray-300/20": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
disabled={
ME_DATA?.role?.type === "authenticated" &&
Expand Down Expand Up @@ -459,7 +459,7 @@ export default function CollaboratorForm() {
value={field.value}
className={cn({
"border-none bg-gray-300/20 placeholder:text-gray-300/95": true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
placeholder="Name"
disabled={
Expand Down Expand Up @@ -487,7 +487,7 @@ export default function CollaboratorForm() {
className={cn({
"center cover m-auto !flex h-48 w-full flex-col space-y-6 rounded-md border border-dashed border-gray-300 bg-opacity-10 bg-cover py-6 text-xs placeholder:text-gray-300/95 hover:border-primary hover:bg-primary/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50":
true,
"bg-green-400": changes?.includes(field.name),
"bg-green-400 placeholder:text-gray-400": changes?.includes(field.name),
})}
style={{
// env.NEXT_PUBLIC_API_URL
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -402,7 +402,7 @@ export default function FormToApprove() {
const colorsChanges = !previousData?.colors
? []
: getObjectDifferences(formValues.colors, previousData?.colors);
// TO DO - add textarea changes

return (
<>
<div className="flex items-center justify-between py-4 sm:px-10 md:px-24 lg:px-32">
Expand Down
Loading

0 comments on commit 63dd245

Please sign in to comment.