chore: Move brand store components into publisher (#4986)

static/js/publisher/components/PrimaryNav/PrimaryNav.tsx

@@ -4,7 +4,7 @@ import {
   SideNavigationText,
 } from "@canonical/react-components";
 
-import { usePublisher } from "../../../brand-store/hooks";
+import { usePublisher } from "../../hooks";
 
 function PrimaryNav({
   collapseNavigation,

static/js/publisher/hooks/index.ts

@@ -2,10 +2,28 @@ import useValidationSets from "./useValidationSets";
 import useValidationSet from "./useValidationSet";
 import useMutateListingData from "./useMutateListingData";
 import useVerified from "./useVerified";
+import useBrandStores from "./useBrandStores";
+import useSnaps from "./useSnaps";
+import useMembers from "./useMembers";
+import useInvites from "./useInvites";
+import useSigningKeys from "./useSigningKeys";
+import useModels from "./useModels";
+import useBrand from "./useBrand";
+import usePolicies from "./usePolicies";
+import usePublisher from "./usePublisher";
 
 export {
   useValidationSets,
   useValidationSet,
   useMutateListingData,
   useVerified,
+  useBrandStores,
+  useSnaps,
+  useMembers,
+  useInvites,
+  useSigningKeys,
+  useModels,
+  useBrand,
+  usePolicies,
+  usePublisher,
 };

static/js/publisher/hooks/useBrand.ts

@@ -0,0 +1,24 @@
+import { useQuery } from "react-query";
+
+function useBrand(id: string | undefined) {
+  return useQuery({
+    queryKey: ["brand", id],
+    queryFn: async () => {
+      const response = await fetch(`/api/store/${id}/brand`);
+
+      if (!response.ok) {
+        throw new Error("There was a problem fetching models");
+      }
+
+      const brandData = await response.json();
+
+      if (!brandData.success) {
+        throw new Error(brandData.message);
+      }
+
+      return brandData.data;
+    },
+  });
+}
+
+export default useBrand;

static/js/publisher/hooks/useModels.ts

@@ -0,0 +1,28 @@
+import { useQuery, UseQueryResult } from "react-query";
+import type { Model as ModelType } from "../types/shared";
+
+const useModels = (
+  brandId: string | undefined,
+): UseQueryResult<ModelType[], Error> => {
+  return useQuery<ModelType[], Error>({
+    queryKey: ["models", brandId],
+    queryFn: async () => {
+      const response = await fetch(`/api/store/${brandId}/models`);
+
+      if (!response.ok) {
+        throw new Error("There was a problem fetching models");
+      }
+
+      const modelsData = await response.json();
+
+      if (!modelsData.success) {
+        throw new Error(modelsData.message);
+      }
+
+      return modelsData.data;
+    },
+    enabled: !!brandId,
+  });
+};
+
+export default useModels;

static/js/publisher/hooks/usePolicies.ts

@@ -0,0 +1,31 @@
+import { useQuery } from "react-query";
+import type { Policy } from "../types/shared";
+import { UsePoliciesResponse, ApiError } from "../types/interfaces";
+
+function usePolicies(
+  brandId: string | undefined,
+  modelId: string | undefined,
+): UsePoliciesResponse {
+  return useQuery<Policy[], ApiError>({
+    queryKey: ["policies", brandId],
+    queryFn: async () => {
+      const response = await fetch(
+        `/api/store/${brandId}/models/${modelId}/policies`,
+      );
+
+      if (!response.ok) {
+        throw new Error("There was a problem fetching policies");
+      }
+
+      const policiesData = await response.json();
+
+      if (!policiesData.success) {
+        throw new Error(policiesData.message);
+      }
+
+      return policiesData.data;
+    },
+  });
+}
+
+export default usePolicies;

static/js/publisher/hooks/usePublisher.ts

@@ -0,0 +1,19 @@
+import { useQuery } from "react-query";
+
+function usePublisher() {
+  return useQuery("publisher", async () => {
+    const response = await fetch("/account.json");
+
+    if (!response.ok) {
+      return {
+        publisher: null,
+      };
+    }
+
+    const publisherData = await response.json();
+
+    return publisherData;
+  });
+}
+
+export default usePublisher;

static/js/publisher/hooks/useSigningKeys.ts

@@ -0,0 +1,27 @@
+import { useQuery, UseQueryResult } from "react-query";
+import type { SigningKey } from "../types/shared";
+
+const useSigningKeys = (
+  brandId: string | undefined,
+): UseQueryResult<SigningKey[], Error> => {
+  return useQuery<SigningKey[], Error>({
+    queryKey: ["signingKeys", brandId],
+    queryFn: async () => {
+      const response = await fetch(`/api/store/${brandId}/signing-keys`);
+
+      if (!response.ok) {
+        throw new Error("There was a problem fetching signing keys");
+      }
+
+      const signingKeysData = await response.json();
+
+      if (!signingKeysData.success) {
+        throw new Error(signingKeysData.message);
+      }
+
+      return signingKeysData.data;
+    },
+  });
+};
+
+export default useSigningKeys;

static/js/brand-store/pages/Model/Policies.tsx → static/js/publisher/pages/Model/Policies.tsx

@@ -16,12 +16,8 @@ import PoliciesTable from "./PoliciesTable";
 import CreatePolicyForm from "./CreatePolicyForm";
 import Navigation from "../../components/Navigation";
 
-import {
-  ApiError,
-  UsePoliciesResponse,
-  usePolicies,
-  useSigningKeys,
-} from "../../hooks";
+import { usePolicies, useSigningKeys } from "../../hooks";
+import { ApiError, UsePoliciesResponse } from "../../types/interfaces";
 import {
   policiesListFilterState,
   policiesListState,

static/js/brand-store/pages/Model/PoliciesTable.tsx → static/js/publisher/pages/Model/PoliciesTable.tsx

@@ -6,7 +6,8 @@ import { MainTable, Button, Modal, Icon } from "@canonical/react-components";
 
 import AppPagination from "../../components/AppPagination";
 
-import { usePolicies, UsePoliciesResponse } from "../../hooks";
+import { usePolicies } from "../../hooks";
+import { UsePoliciesResponse } from "../../types/interfaces";
 import { brandIdState } from "../../state/brandStoreState";
 import { filteredPoliciesListState } from "../../state/policiesState";
 

static/js/publisher/types/interfaces.ts

@@ -0,0 +1,13 @@
+import type { Policy } from "../types/shared";
+
+export interface UsePoliciesResponse {
+  isLoading: boolean;
+  isError: boolean;
+  error: unknown;
+  refetch: () => void;
+  data: Policy[] | undefined;
+}
+
+export interface ApiError {
+  message: string;
+}

static/js/brand-store/utils/checkModelNameExists.test.ts → static/js/publisher/utils/__tests__/checkModelNameExists.test.ts

@@ -1,4 +1,4 @@
-import checkModelNameExists from "./checkModelNameExists";
+import checkModelNameExists from "../checkModelNameExists";
 
 const models = [
   {

static/js/brand-store/utils/checkSigningKeyExists.test.ts → static/js/publisher/utils/__tests__/checkSigningKeyExists.test.ts

@@ -1,4 +1,4 @@
-import checkSigningKeyExists from "./checkSigningKeyExists";
+import checkSigningKeyExists from "../checkSigningKeyExists";
 
 const signingKeys = [
   {

static/js/brand-store/utils/isClosedPanel.test.ts → static/js/publisher/utils/__tests__/isClosedPanel.test.ts

@@ -1,4 +1,4 @@
-import isClosedPanel from "./isClosedPanel";
+import isClosedPanel from "../isClosedPanel";
 
 describe("isClosedPanel", () => {
   it("returns true if key isn't at the end of the path", () => {

static/js/brand-store/utils/maskString.test.ts → static/js/publisher/utils/__tests__/maskString.test.ts

@@ -1,4 +1,4 @@
-import maskString from "./maskString";
+import maskString from "../maskString";
 
 describe("maskString", () => {
   const str = "761bbec69e2844958fcdj48DfP";

static/js/brand-store/utils/sortByDateDescending.test.ts → static/js/publisher/utils/__tests__/sortByDateDescending.test.ts

@@ -1,4 +1,4 @@
-import sortByDateDescending from "./sortByDateDescending";
+import sortByDateDescending from "../sortByDateDescending";
 
 const earlyItem = { "created-at": "2023-06-21T14:10:07.108051" };
 const lateItem = { "created-at": "2023-06-22T12:45:28.301419" };