Fix: Bugs in valueset page (#10738)

ohcnetwork · Feb 25, 2025 · a51d39c · a51d39c
1 parent b45e620
commit a51d39c
Show file tree

Hide file tree

Showing 5 changed files with 138 additions and 112 deletions.
diff --git a/public/locale/en.json b/public/locale/en.json
@@ -2008,6 +2008,7 @@
   "save_and_continue": "Save and Continue",
   "save_investigation": "Save Investigation",
   "saving": "Saving...",
+  "retired":"Retired",
   "scan_asset_qr": "Scan Asset QR!",
   "schedule": "Schedule",
   "schedule_an_appointment_or_create_a_new_encounter": "Schedule an appointment or create a new encounter",
@@ -2461,6 +2462,7 @@
   "valid_year_of_birth": "Please enter a valid year of birth (YYYY)",
   "value": "Value",
   "value_set": "Value Set",
+  "save_valueset":"Save ValueSet",
   "valuesets": "Valuesets",
   "vehicle_preference": "Vehicle preference",
   "vendor_name": "Vendor Name",

diff --git a/src/components/ValueSet/ValueSetEditor.tsx b/src/components/ValueSet/ValueSetEditor.tsx
@@ -9,7 +9,6 @@ import query from "@/Utils/request/query";
 import {
   CreateValuesetModel,
   UpdateValuesetModel,
-  ValuesetBase,
   ValuesetFormType,
 } from "@/types/valueset/valueset";
 import valuesetApi from "@/types/valueset/valuesetApi";
@@ -22,7 +21,6 @@ interface ValueSetEditorProps {
 
 export function ValueSetEditor({ slug }: ValueSetEditorProps) {
   const navigate = useNavigate();
-
   const queryClient = useQueryClient();
   // Fetch existing valueset if we're editing
   const { data: existingValueset, isLoading } = useQuery({
@@ -36,9 +34,9 @@ export function ValueSetEditor({ slug }: ValueSetEditorProps) {
   // Create mutation
   const createMutation = useMutation({
     mutationFn: mutate(valuesetApi.create),
-    onSuccess: (data: ValuesetBase) => {
+    onSuccess: () => {
       toast.success("ValueSet created successfully");
-      navigate(`/valuesets/${data.slug}`);
+      navigate(`/admin/valuesets`);
     },
   });
 

diff --git a/src/components/ValueSet/ValueSetForm.tsx b/src/components/ValueSet/ValueSetForm.tsx
@@ -1,7 +1,9 @@
 import { zodResolver } from "@hookform/resolvers/zod";
 import { PlusIcon, TrashIcon, UpdateIcon } from "@radix-ui/react-icons";
 import { useMutation } from "@tanstack/react-query";
+import { t } from "i18next";
 import { useFieldArray, useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import * as z from "zod";
 
@@ -34,59 +36,6 @@ import {
 import valuesetApi from "@/types/valueset/valuesetApi";
 
 // Create a schema for form validation
-const valuesetFormSchema = z.object({
-  name: z.string().min(1, "Name is required"),
-  slug: z.string().min(1, "Slug is required"),
-  description: z.string(),
-  status: z.enum(["active", "inactive"]),
-  is_system_defined: z.boolean(),
-  compose: z.object({
-    include: z.array(
-      z.object({
-        system: z.string(),
-        concept: z
-          .array(
-            z.object({
-              code: z.string(),
-              display: z.string(),
-            }),
-          )
-          .optional(),
-        filter: z
-          .array(
-            z.object({
-              property: z.string(),
-              op: z.string(),
-              value: z.string(),
-            }),
-          )
-          .optional(),
-      }),
-    ),
-    exclude: z.array(
-      z.object({
-        system: z.string(),
-        concept: z
-          .array(
-            z.object({
-              code: z.string(),
-              display: z.string(),
-            }),
-          )
-          .optional(),
-        filter: z
-          .array(
-            z.object({
-              property: z.string(),
-              op: z.string(),
-              value: z.string(),
-            }),
-          )
-          .optional(),
-      }),
-    ),
-  }),
-});
 
 interface ValueSetFormProps {
   initialData?: ValuesetFormType;
@@ -392,11 +341,66 @@ function RuleFields({
   );
 }
 
+const valuesetFormSchema = z.object({
+  name: z.string().min(1, t("field_required")),
+  slug: z.string().min(1, t("field_required")),
+  description: z.string(),
+  status: z.enum(["active", "draft", "retired", "unknown"]),
+  is_system_defined: z.boolean(),
+  compose: z.object({
+    include: z.array(
+      z.object({
+        system: z.string(),
+        concept: z
+          .array(
+            z.object({
+              code: z.string(),
+              display: z.string(),
+            }),
+          )
+          .optional(),
+        filter: z
+          .array(
+            z.object({
+              property: z.string(),
+              op: z.string(),
+              value: z.string(),
+            }),
+          )
+          .optional(),
+      }),
+    ),
+    exclude: z.array(
+      z.object({
+        system: z.string(),
+        concept: z
+          .array(
+            z.object({
+              code: z.string(),
+              display: z.string(),
+            }),
+          )
+          .optional(),
+        filter: z
+          .array(
+            z.object({
+              property: z.string(),
+              op: z.string(),
+              value: z.string(),
+            }),
+          )
+          .optional(),
+      }),
+    ),
+  }),
+});
 export function ValueSetForm({
   initialData,
   onSubmit,
   isSubmitting,
 }: ValueSetFormProps) {
+  const { t } = useTranslation();
+
   const form = useForm<ValuesetFormType>({
     resolver: zodResolver(valuesetFormSchema),
     defaultValues: {
@@ -420,7 +424,7 @@ export function ValueSetForm({
           name="name"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Name</FormLabel>
+              <FormLabel required>{t("name")}</FormLabel>
               <FormControl>
                 <Input {...field} />
               </FormControl>
@@ -434,7 +438,7 @@ export function ValueSetForm({
           name="slug"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Slug</FormLabel>
+              <FormLabel required>{t("slug")}</FormLabel>
               <FormControl>
                 <Input {...field} />
               </FormControl>
@@ -448,7 +452,7 @@ export function ValueSetForm({
           name="description"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Description</FormLabel>
+              <FormLabel>{t("description")}</FormLabel>
               <FormControl>
                 <Textarea {...field} />
               </FormControl>
@@ -462,16 +466,18 @@ export function ValueSetForm({
           name="status"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Status</FormLabel>
+              <FormLabel required>{t("status")}</FormLabel>
               <Select onValueChange={field.onChange} defaultValue={field.value}>
                 <FormControl>
                   <SelectTrigger>
-                    <SelectValue placeholder="Select status" />
+                    <SelectValue placeholder="Select Status" />
                   </SelectTrigger>
                 </FormControl>
                 <SelectContent>
-                  <SelectItem value="active">Active</SelectItem>
-                  <SelectItem value="inactive">Inactive</SelectItem>
+                  <SelectItem value="active">{t("active")}</SelectItem>
+                  <SelectItem value="draft">{t("draft")}</SelectItem>
+                  <SelectItem value="retired">{t("retired")}</SelectItem>
+                  <SelectItem value="unknown">{t("unknown")}</SelectItem>
                 </SelectContent>
               </Select>
               <FormMessage />
@@ -485,7 +491,7 @@ export function ValueSetForm({
         </div>
 
         <Button type="submit" disabled={isSubmitting}>
-          {isSubmitting ? "Saving..." : "Save ValueSet"}
+          {isSubmitting ? t("saving") : t("save_valueset")}
         </Button>
       </form>
     </Form>