continue order test: bugfix

src/lib/components/composable/use-search.svelte.js

@@ -4,6 +4,7 @@ export function useSearch(searchFields, searchApiFunction) {
 	let searchData = $state([]);
     let selectOptions = $state({});
     let loadingOptions = $state({});
+    let isRefreshData = $state(false);
 
     function initializeSearchQuery(fields) {
         const query = {};
@@ -63,6 +64,8 @@ export function useSearch(searchFields, searchApiFunction) {
         get isLoading() { return isLoading; },
         get loadingOptions() { return loadingOptions; },
         get selectOptions() { return selectOptions; },
+        get isRefreshData() { return isRefreshData; },
+        set isRefreshData(val) { isRefreshData = val; },
         handleSearch,
         handleReset,
         fetchOptions,

src/lib/components/order/ordertest/config/ordertest-form-config.js

@@ -10,7 +10,21 @@ export const orderTestSchema = z.object({
         })
     )
     .min(1, " "),
+    TrnDate: z.string(),
+    EffDate: z.string(),
 })
+.superRefine((data, ctx) => {
+    const trn = new Date(data.TrnDate);
+    const eff = new Date(data.EffDate);
+		if (trn > eff) {
+            console.log('ff')
+			ctx.addIssue({
+				code: z.ZodIssueCode.custom,
+				message: 'Cant set before Trn Date',
+				path: ['EffDate']
+			});
+		}
+	});
 
 export const orderTestInitialForm = {
     InternalOID: '',
@@ -19,7 +33,6 @@ export const orderTestInitialForm = {
     InternalPID: '',
     SiteID: '',
     PVADTID: '',
-    ReqApp: '',
     Priority: '',
     TrnDate: '',
     EffDate: '',
@@ -30,6 +43,7 @@ export const orderTestInitialForm = {
 
 export const orderTestDefaultErrors = {
     Tests: '',
+    EffDate: '',
 };
 
 export const orderTestFormFields = [
@@ -66,12 +80,6 @@ export const orderTestFormFields = [
                         required: false, 
                         type: "text", 
                     },
-                    { 
-                        key: "ReqApp", 
-                        label: "Requested Application", 
-                        required: false, 
-                        type: "text", 
-                    },
                 ]
             },
             {
@@ -89,7 +97,8 @@ export const orderTestFormFields = [
                         label: "Effective Date", 
                         required: false, 
                         type: "datetime",
-                        allowFuture: true
+                        allowFuture: true,
+                        validateOn: ['input']
                     },
                 ]
             },

src/lib/components/order/ordertest/page/master-page.svelte

@@ -27,16 +27,15 @@
     let visitData = $state(null);
     let isLoadingVisit = $state(false);
     let hasFetched = $state(false);
-    let isRefreshData = $state(false);
 
     const search = useSearch(searchFields, searchParam);
     const handlers = {
         refresh: async () => {
-            isRefreshData = true;
+            search.isRefreshData = true;
             try {
                 await handlePatientConfirm(tempSelectedPatient, tempSelectedVisit);
             } finally {
-                isRefreshData = false;
+                search.isRefreshData = false;
             }
         }
     };
@@ -152,7 +151,7 @@
                     </div>
                 {/if}
                 <div class="flex-1 w-full h-full relative overflow-hidden">
-                    {#if isRefreshData}
+                    {#if search.isRefreshData}
                         <div class="absolute inset-0 flex items-center justify-center bg-background/50 z-10">
                             <Spinner class="size-6" />
                         </div>

src/lib/components/reusable/form/order-form-renderer.svelte

@@ -163,6 +163,7 @@
 
 		selectedTests = [...pendingTests];
 	});
+	$inspect(formState.errors)
 </script>
 
 {#snippet Fieldset({
@@ -179,7 +180,8 @@
 	labelKey,
 	withLabel = true,
 })}
-	<div class="flex w-full flex-col min-h-0 flex-1 h-full gap-1.5 overflow-hidden">
+	<!-- <div class="flex w-full flex-col min-h-0 flex-1 h-full gap-1.5"> -->
+	<div class="flex w-full flex-col min-h-0 gap-1.5 {type === 'tests' ? 'flex-1 h-full overflow-hidden' : ''}">
 		{#if withLabel}
 			<div class="flex justify-between items-center w-full">
 				<div class="ps-1">
@@ -190,7 +192,8 @@
 				{/if}
 			</div>
 		{/if}
-		<div class="relative flex flex-col h-full items-start w-full flex-1 p-1 overflow-hidden">
+		<!-- <div class="relative flex flex-col h-full items-start w-full flex-1 p-1"> -->
+		<div class="relative flex flex-col items-start w-full {type === 'tests' ? 'h-full flex-1' : ''} p-1">
 			{#if type === 'text'}
 				<Input
 					type="text"
@@ -283,7 +286,7 @@
                 </div>
 			{:else if type === "tests"}
 				<div class="flex flex-1 h-full min-h-0 w-full gap-2">
-					<div class="flex flex-1 flex-col gap-2 overflow-hidden min-h-0 h-full w-full">
+					<div class="flex flex-1 flex-col gap-2 overflow-hidden min-h-0 h-full w-full p-1">
 						<div class="shrink-0 h-18 flex gap-2 flex flex-col">
 							<div class="h-7 border-b-2 flex justify-between items-center">
 								<p class="text-xs font-medium text-muted-foreground uppercase tracking-wide">Test list</p>
@@ -367,7 +370,7 @@
 							</Button>
 						</div>
 					</div>
-					<div class="flex flex-1 flex-col overflow-hidden min-h-0 h-full w-1/2 gap-2">
+					<div class="flex flex-1 flex-col overflow-hidden min-h-0 h-full gap-2 p-1">
 						<div class="shrink-0 h-7 border-b-2 flex justify-between items-center">
 							<p class="text-xs font-medium text-muted-foreground uppercase tracking-wide">Test ordered</p>
 							<Badge variant="outline">{pendingTests.length} test(s)</Badge>
@@ -416,19 +419,22 @@
 					placeholder="Custom field type: {type}"
 				/>
 			{/if}
-			<div class="absolute top-8 min-h-[1rem] w-full">
+
-				{#if formState.errors[key]}
+			{#if type !== 'tests'}
-                    <span class="text-destructive text-sm leading-none">
+				<div class="h-5 w-full">
-                        {formState.errors[key]}
+					{#if formState.errors[key]}
-                    </span>
+						<span class="text-destructive text-sm leading-none">
-                {/if}
+							{formState.errors[key]}
-			</div>
+						</span>
+					{/if}
+				</div>
+			{/if}
 		</div>
 	</div>
 {/snippet}
 
 {#snippet GroupBlock(groups)}
-    <div class="p-2 min-h-0 flex-1 flex flex-col h-full"> 
+    <div class="p-2 min-h-0 flex-1 flex flex-col h-full space-y-6"> 
         {#each groups as group}
             <div class="flex flex-col flex-1 space-y-4 h-full">
                 {#if group.title}
@@ -439,7 +445,7 @@
  
                 {#each group.rows as row}
                     <div
-                        class="grid grid-cols-1 grid-rows-1 space-y-2 h-full gap-3 min-h-0 md:gap-2"
+                        class="grid grid-cols-1 gap-3 min-h-0 md:gap-2"
 						class:h-full={row.columns.some(col => col.key === "Tests")}
                         class:md:grid-cols-1={row.columns.length === 1}
                         class:md:grid-cols-2={row.columns.length === 2}