add i18n for valuesetform and options updated for status and navigation fix on creating new

Author: AdityaJ2305

public/locale/en.json

@@ -1906,6 +1906,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",
@@ -2340,6 +2341,7 @@
   "valid_to": "Valid Till",
   "valid_year_of_birth": "Please enter a valid year of birth (YYYY)",
   "value_set": "Value Set",
+  "save_valuset":"Save ValueSet",
   "valuesets": "Valuesets",
   "vehicle_preference": "Vehicle preference",
   "vendor_name": "Vendor Name",

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";
@@ -35,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`);
     },
   });
 

src/components/ValueSet/ValueSetForm.tsx

@@ -2,6 +2,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { PlusIcon, TrashIcon, UpdateIcon } from "@radix-ui/react-icons";
 import { useMutation } from "@tanstack/react-query";
 import { useFieldArray, useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 import * as z from "zod";
 
@@ -34,59 +35,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;
@@ -396,6 +344,61 @@ export function ValueSetForm({
   onSubmit,
   isSubmitting,
 }: ValueSetFormProps) {
+  const { t } = useTranslation();
+
+  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(),
+        }),
+      ),
+    }),
+  });
   const form = useForm<ValuesetFormType>({
     resolver: zodResolver(valuesetFormSchema),
     defaultValues: {
@@ -419,7 +422,7 @@ export function ValueSetForm({
           name="name"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Name</FormLabel>
+              <FormLabel required>{t("name")}</FormLabel>
               <FormControl>
                 <Input {...field} />
               </FormControl>
@@ -433,7 +436,7 @@ export function ValueSetForm({
           name="slug"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Slug</FormLabel>
+              <FormLabel required>{t("slug")}</FormLabel>
               <FormControl>
                 <Input {...field} />
               </FormControl>
@@ -447,7 +450,7 @@ export function ValueSetForm({
           name="description"
           render={({ field }) => (
             <FormItem>
-              <FormLabel>Description</FormLabel>
+              <FormLabel>{t("description")}</FormLabel>
               <FormControl>
                 <Textarea {...field} />
               </FormControl>
@@ -461,16 +464,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 />
@@ -484,7 +489,7 @@ export function ValueSetForm({
         </div>
 
         <Button type="submit" disabled={isSubmitting}>
-          {isSubmitting ? "Saving..." : "Save ValueSet"}
+          {isSubmitting ? t("saving") : t("save_valuset")}
         </Button>
       </form>
     </Form>

src/components/ValueSet/ValueSetList.tsx

@@ -93,7 +93,7 @@ export function ValueSetList() {
                         : "bg-red-100 text-red-800 hover:bg-red-200"
                     }
                   >
-                    {valueset.status}
+                    {t(valueset.status)}
                   </Badge>
                 </td>
                 <td className="px-6 py-4">
@@ -107,12 +107,11 @@ export function ValueSetList() {
                 <td className="whitespace-nowrap px-6 py-4 text-sm">
                   {!valueset.is_system_defined && (
                     <Button
-                      variant="ghost"
+                      variant="primary"
                       size="sm"
                       onClick={() =>
                         navigate(`/admin/valuesets/${valueset.slug}/edit`)
                       }
-                      className="hover:bg-primary/5"
                     >
                       {t("edit")}
                     </Button>

src/types/valueset/valueset.ts

@@ -26,7 +26,7 @@ export interface ValuesetBase {
   name: string;
   description: string;
   compose: ValuesetCompose;
-  status: "active" | "inactive";
+  status: "active" | "draft" | "retired" | "unknown";
   is_system_defined: boolean;
   created_by: string | null;
   updated_by: string | null;