fix: scorecard form

Fixed issues with sharing settings control on form

packages/app/src/modules/ScorecardManagement/hooks/meta.ts

@@ -1,10 +1,8 @@
-import { DATASTORE_NAMESPACE, UserState } from "@scorecard/shared";
+import { DATASTORE_NAMESPACE, getUserAuthority, UserState } from "@scorecard/shared";
 import { useForm } from "react-hook-form";
 import { useParams } from "react-router-dom";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useDataQuery } from "@dhis2/app-runtime";
-import { useGetScorecardSharingSettings } from "../../ScorecardList/hooks/authority";
-import { useEffect, useState } from "react";
 import { useFormSchema } from "./schema";
 import { uid } from "@hisptz/dhis2-utils";
 import i18n from "@dhis2/d2-i18n";
@@ -96,15 +94,13 @@ const getDefaultValue = (user: { id: string }): Partial<ScorecardConfig> => ({
 export default function useScorecardFormMetadata() {
 	const user = useRecoilValue(UserState);
 	const { id } = useParams<{ id: string }>();
-	const [access, setAccess] = useState<{ read: boolean; write: boolean } | null>(null);
-	const { refetch } = useDataQuery<{ scorecard: ScorecardConfig }>(query, {
+	const { refetch, data } = useDataQuery<{ scorecard: ScorecardConfig }>(query, {
 		variables: {
 			id
 		},
 		lazy: true
 	});
 	const schema = useFormSchema();
-	const getAccess = useGetScorecardSharingSettings();
 	const form = useForm<ScorecardConfig>({
 		shouldFocusError: true,
 		defaultValues: async () => {
@@ -119,20 +115,8 @@ export default function useScorecardFormMetadata() {
 		resolver: zodResolver(schema)
 	});
 
-	async function getScorecardAccess() {
-		setAccess(await getAccess(id!));
-	}
-
-	useEffect(() => {
-		if (id) {
-			getScorecardAccess();
-		} else {
-			setAccess({ read: true, write: true });
-		}
-	}, [id]);
-
 	return {
 		form,
-		access
+		access: data ? getUserAuthority(user, data?.scorecard.sharing) : undefined
 	};
 }

packages/app/src/modules/ScorecardManagement/index.tsx

@@ -3,17 +3,20 @@ import React, { Suspense } from "react";
 import { FormProvider } from "react-hook-form";
 import useScorecardFormMetadata from "./hooks/meta";
 import { ManagementTabBar } from "./components/ManagementTabBar";
-import { Outlet } from "react-router-dom";
+import { Outlet, useParams } from "react-router-dom";
 import { TabHeader } from "./components/TabHeader";
 import { NavigationButtons, StepNavigationButtons } from "./components/NavigationButtons";
 
 export default function ScoreCardManagement() {
+	const { id } = useParams<{ id?: string }>();
 	const { form, access } = useScorecardFormMetadata();
 	if (form.formState.isLoading || access == null) {
 		return <FullPageLoader />;
 	}
 	if (!access.write) {
-		return <AccessDeniedPage accessType={"edit"} />;
+		if (id) {
+			return <AccessDeniedPage accessType={"edit"} />;
+		}
 	}
 
 	return (