refactor

pluralsh · Dec 4, 2024 · 036b79a · 036b79a
1 parent 28c08d9
commit 036b79a
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 141 deletions.
diff --git a/assets/src/components/catalog/Catalog.tsx b/assets/src/components/catalog/Catalog.tsx
@@ -29,7 +29,7 @@ export function Catalog() {
   const id = useParams()[CATALOG_PARAM_ID] as string
   const [permissionsOpen, setPermissionsOpen] = useState(false)
 
-  const { data, error } = useCatalogQuery({ variables: { id } })
+  const { data, refetch, error } = useCatalogQuery({ variables: { id } })
 
   const catalog = data?.catalog
 
@@ -109,6 +109,7 @@ export function Catalog() {
                 </Button>
                 <CatalogPermissions
                   catalog={catalog}
+                  refetch={refetch}
                   open={permissionsOpen}
                   onClose={() => setPermissionsOpen(false)}
                 />

diff --git a/assets/src/components/catalog/CatalogPermissions.tsx b/assets/src/components/catalog/CatalogPermissions.tsx
@@ -1,17 +1,8 @@
-import {
-  ComponentProps,
-  FormEvent,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react'
-import { Permissions, PermissionsModal } from '../cd/utils/PermissionsModal.tsx'
+import { FormEvent, useCallback, useEffect, useMemo, useState } from 'react'
+import { Permissions } from '../cd/utils/PermissionsModal.tsx'
 import {
   CatalogFragment,
-  PolicyBindingFragment,
   UpsertCatalogMutationVariables,
-  useCatalogBindingsQuery,
   useUpsertCatalogMutation,
 } from '../../generated/graphql.ts'
 import { ModalMountTransition } from '../utils/ModalMountTransition.tsx'
@@ -25,96 +16,69 @@ import { StepBody } from '../cd/ModalAlt.tsx'
 import LoadingIndicator from '../utils/LoadingIndicator.tsx'
 import { GqlError } from '../utils/Alert.tsx'
 
-export function CatalogPermissions(
-  props: ComponentProps<typeof CatalogPermissionsModalWrapper>
-) {
-  return (
-    <ModalMountTransition open={props.open}>
-      <CatalogPermissionsModalWrapper {...props} />
-    </ModalMountTransition>
-  )
-}
-
-function CatalogPermissionsModalWrapper({
+export function CatalogPermissions({
   catalog,
-  ...props
-}: Omit<
-  ComponentProps<typeof PermissionsModal>,
-  'bindings' | 'id' | 'type' | 'header'
-> & {
+  open,
+  onClose,
+  refetch,
+}: {
   catalog: CatalogFragment
+  open: boolean
+  onClose: () => void
+  refetch?: () => void
 }) {
-  const { data, refetch } = useCatalogBindingsQuery({
-    variables: { id: catalog.id },
-    fetchPolicy: 'no-cache',
-    skip: !catalog.id || !props.open,
-  })
-
-  const bindings = data?.catalog
-
-  if (!bindings) {
-    return null
-  }
-
   return (
-    <CatalogPermissionsModal
-      catalog={catalog}
-      bindings={bindings}
-      refetch={refetch}
-      {...props}
-    />
+    <ModalMountTransition open={open}>
+      <CatalogPermissionsModal
+        catalog={catalog}
+        refetch={refetch}
+        open={open}
+        onClose={onClose}
+      />
+    </ModalMountTransition>
   )
 }
 
 export function CatalogPermissionsModal({
   catalog,
-  bindings,
   open,
   onClose,
   refetch,
 }: {
   catalog: CatalogFragment
-  bindings: {
-    createBindings?: Nullable<Nullable<PolicyBindingFragment>[]>
-    readBindings?: Nullable<Nullable<PolicyBindingFragment>[]>
-    writeBindings?: Nullable<Nullable<PolicyBindingFragment>[]>
-  }
   open: boolean
   onClose: () => void
   refetch?: () => void
 }) {
   const theme = useTheme()
 
-  const [createBindings, setCreateBindings] = useState(bindings.createBindings)
-  const [readBindings, setReadBindings] = useState(bindings.readBindings)
-  const [writeBindings, setWriteBindings] = useState(bindings.writeBindings)
-
-  useEffect(() => {
-    setCreateBindings(bindings.createBindings)
-  }, [bindings.createBindings])
+  const [createBindings, setCreateBindings] = useState(catalog.createBindings)
+  const [readBindings, setReadBindings] = useState(catalog.readBindings)
+  const [writeBindings, setWriteBindings] = useState(catalog.writeBindings)
 
-  useEffect(() => {
-    setReadBindings(bindings.readBindings)
-  }, [bindings.readBindings])
-
-  useEffect(() => {
-    setWriteBindings(bindings.writeBindings)
-  }, [bindings.writeBindings])
+  useEffect(
+    () => setCreateBindings(catalog.createBindings),
+    [catalog.createBindings]
+  )
+  useEffect(() => setReadBindings(catalog.readBindings), [catalog.readBindings])
+  useEffect(
+    () => setWriteBindings(catalog.writeBindings),
+    [catalog.writeBindings]
+  )
 
   const uniqueCreateBindings = useMemo(
     () => uniqWith(createBindings, isEqual),
     [createBindings]
   )
-
   const uniqueReadBindings = useMemo(
     () => uniqWith(readBindings, isEqual),
     [readBindings]
   )
-
   const uniqueWriteBindings = useMemo(
     () => uniqWith(writeBindings, isEqual),
     [writeBindings]
   )
+
   const [mutation, { loading: mutationLoading, error: mutationError }] =
     useUpsertCatalogMutation({
       onCompleted: () => {
@@ -219,7 +183,7 @@ export function CatalogPermissionsModal({
             <b> {catalog.name}</b> catalog
           </StepBody>
         </div>
-        {!bindings ? (
+        {!catalog ? (
           <LoadingIndicator />
         ) : (
           <div css={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr' }}>

diff --git a/assets/src/generated/graphql-kubernetes.ts b/assets/src/generated/graphql-kubernetes.ts
@@ -1,4 +1,4 @@
- 
+/* eslint-disable */
 /* prettier-ignore */
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';

diff --git a/assets/src/generated/graphql-plural.ts b/assets/src/generated/graphql-plural.ts
@@ -1,4 +1,4 @@
- 
+/* eslint-disable */
 /* prettier-ignore */
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';

diff --git a/assets/src/generated/graphql.ts b/assets/src/generated/graphql.ts
@@ -1,4 +1,4 @@
- 
+/* eslint-disable */
 /* prettier-ignore */
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
@@ -10069,9 +10069,7 @@ export type CreateBuildMutationVariables = Exact<{
 
 export type CreateBuildMutation = { __typename?: 'RootMutationType', createBuild?: { __typename?: 'Build', id: string } | null };
 
-export type CatalogFragment = { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null };
-
-export type CatalogBindingsFragment = { __typename?: 'Catalog', readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null };
+export type CatalogFragment = { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null, createBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null };
 
 export type CatalogsQueryVariables = Exact<{
   after?: InputMaybe<Scalars['String']['input']>;
@@ -10081,36 +10079,29 @@ export type CatalogsQueryVariables = Exact<{
 }>;
 
 
-export type CatalogsQuery = { __typename?: 'RootQueryType', catalogs?: { __typename?: 'CatalogConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean, endCursor?: string | null, hasPreviousPage: boolean, startCursor?: string | null }, edges?: Array<{ __typename?: 'CatalogEdge', node?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null } | null } | null> | null } | null };
+export type CatalogsQuery = { __typename?: 'RootQueryType', catalogs?: { __typename?: 'CatalogConnection', pageInfo: { __typename?: 'PageInfo', hasNextPage: boolean, endCursor?: string | null, hasPreviousPage: boolean, startCursor?: string | null }, edges?: Array<{ __typename?: 'CatalogEdge', node?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null, createBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null } | null } | null> | null } | null };
 
 export type CatalogQueryVariables = Exact<{
   id?: InputMaybe<Scalars['ID']['input']>;
   name?: InputMaybe<Scalars['String']['input']>;
 }>;
 
 
-export type CatalogQuery = { __typename?: 'RootQueryType', catalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null } | null };
-
-export type CatalogBindingsQueryVariables = Exact<{
-  id: Scalars['ID']['input'];
-}>;
-
-
-export type CatalogBindingsQuery = { __typename?: 'RootQueryType', catalog?: { __typename?: 'Catalog', readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null } | null };
+export type CatalogQuery = { __typename?: 'RootQueryType', catalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null, createBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null } | null };
 
 export type UpsertCatalogMutationVariables = Exact<{
   attributes?: InputMaybe<CatalogAttributes>;
 }>;
 
 
-export type UpsertCatalogMutation = { __typename?: 'RootMutationType', upsertCatalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null } | null };
+export type UpsertCatalogMutation = { __typename?: 'RootMutationType', upsertCatalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null, createBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null } | null };
 
 export type DeleteCatalogMutationVariables = Exact<{
   id: Scalars['ID']['input'];
 }>;
 
 
-export type DeleteCatalogMutation = { __typename?: 'RootMutationType', deleteCatalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null } | null };
+export type DeleteCatalogMutation = { __typename?: 'RootMutationType', deleteCatalog?: { __typename?: 'Catalog', id: string, name: string, author?: string | null, description?: string | null, category?: string | null, icon?: string | null, darkIcon?: string | null, createBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, readBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null, writeBindings?: Array<{ __typename?: 'PolicyBinding', id?: string | null, user?: { __typename?: 'User', id: string, name: string, email: string } | null, group?: { __typename?: 'Group', id: string, name: string } | null } | null> | null } | null };
 
 export type ClusterNodeFragment = { __typename?: 'Node', metadata: { __typename?: 'Metadata', uid?: string | null, name: string, namespace?: string | null, creationTimestamp?: string | null, labels?: Array<{ __typename?: 'LabelPair', name?: string | null, value?: string | null } | null> | null, annotations?: Array<{ __typename?: 'LabelPair', name?: string | null, value?: string | null } | null> | null }, status: { __typename?: 'NodeStatus', phase?: string | null, allocatable?: Record<string, unknown> | null, capacity?: Record<string, unknown> | null, conditions?: Array<{ __typename?: 'NodeCondition', type?: string | null, status?: string | null, message?: string | null } | null> | null }, spec: { __typename?: 'NodeSpec', podCidr?: string | null, providerId?: string | null } };
 
@@ -12371,10 +12362,9 @@ export const CatalogFragmentDoc = gql`
   category
   icon
   darkIcon
-}
-    `;
-export const CatalogBindingsFragmentDoc = gql`
-    fragment CatalogBindings on Catalog {
+  createBindings {
+    ...PolicyBinding
+  }
   readBindings {
     ...PolicyBinding
   }
@@ -16898,46 +16888,6 @@ export type CatalogQueryHookResult = ReturnType<typeof useCatalogQuery>;
 export type CatalogLazyQueryHookResult = ReturnType<typeof useCatalogLazyQuery>;
 export type CatalogSuspenseQueryHookResult = ReturnType<typeof useCatalogSuspenseQuery>;
 export type CatalogQueryResult = Apollo.QueryResult<CatalogQuery, CatalogQueryVariables>;
-export const CatalogBindingsDocument = gql`
-    query CatalogBindings($id: ID!) {
-  catalog(id: $id) {
-    ...CatalogBindings
-  }
-}
-    ${CatalogBindingsFragmentDoc}`;
-
-/**
- * __useCatalogBindingsQuery__
- *
- * To run a query within a React component, call `useCatalogBindingsQuery` and pass it any options that fit your needs.
- * When your component renders, `useCatalogBindingsQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useCatalogBindingsQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useCatalogBindingsQuery(baseOptions: Apollo.QueryHookOptions<CatalogBindingsQuery, CatalogBindingsQueryVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<CatalogBindingsQuery, CatalogBindingsQueryVariables>(CatalogBindingsDocument, options);
-      }
-export function useCatalogBindingsLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<CatalogBindingsQuery, CatalogBindingsQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<CatalogBindingsQuery, CatalogBindingsQueryVariables>(CatalogBindingsDocument, options);
-        }
-export function useCatalogBindingsSuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions<CatalogBindingsQuery, CatalogBindingsQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useSuspenseQuery<CatalogBindingsQuery, CatalogBindingsQueryVariables>(CatalogBindingsDocument, options);
-        }
-export type CatalogBindingsQueryHookResult = ReturnType<typeof useCatalogBindingsQuery>;
-export type CatalogBindingsLazyQueryHookResult = ReturnType<typeof useCatalogBindingsLazyQuery>;
-export type CatalogBindingsSuspenseQueryHookResult = ReturnType<typeof useCatalogBindingsSuspenseQuery>;
-export type CatalogBindingsQueryResult = Apollo.QueryResult<CatalogBindingsQuery, CatalogBindingsQueryVariables>;
 export const UpsertCatalogDocument = gql`
     mutation UpsertCatalog($attributes: CatalogAttributes) {
   upsertCatalog(attributes: $attributes) {
@@ -24881,7 +24831,6 @@ export const namedOperations = {
     PluralContext: 'PluralContext',
     Catalogs: 'Catalogs',
     Catalog: 'Catalog',
-    CatalogBindings: 'CatalogBindings',
     Clusters: 'Clusters',
     ClustersTiny: 'ClustersTiny',
     VClusters: 'VClusters',
@@ -25130,7 +25079,6 @@ export const namedOperations = {
     ClusterRestore: 'ClusterRestore',
     PageInfo: 'PageInfo',
     Catalog: 'Catalog',
-    CatalogBindings: 'CatalogBindings',
     ClusterNode: 'ClusterNode',
     ClusterCondition: 'ClusterCondition',
     Taint: 'Taint',

diff --git a/assets/src/graph/catalog.graphql b/assets/src/graph/catalog.graphql
@@ -6,9 +6,6 @@ fragment Catalog on Catalog {
   category
   icon
   darkIcon
-}
-
-fragment CatalogBindings on Catalog {
   createBindings {
     ...PolicyBinding
   }
@@ -39,12 +36,6 @@ query Catalog($id: ID, $name: String) {
   }
 }
 
-query CatalogBindings($id: ID!) {
-  catalog(id: $id) {
-    ...CatalogBindings
-  }
-}
-
 mutation UpsertCatalog($attributes: CatalogAttributes) {
   upsertCatalog(attributes: $attributes) {
     ...Catalog