From 4ba3ef4f0ec76b2a6f4ddc816ebbabe4e20ddb46 Mon Sep 17 00:00:00 2001
From: Marcin Maciaszczyk <marcin9yk@icloud.com>
Date: Fri, 18 Oct 2024 14:47:01 +0200
Subject: [PATCH] fix list colors

---
 .../plural-cloud/EditPluralOIDCClient.tsx     |  6 ++---
 .../plural-cloud/EditPluralOIDCClients.tsx    | 24 ++++++++++---------
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClient.tsx b/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClient.tsx
index 6611be513..67f7babad 100644
--- a/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClient.tsx
+++ b/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClient.tsx
@@ -24,19 +24,19 @@ export function EditPluralOIDCClientModal({
   onClose,
   instanceName,
   provider,
-  useModalOverlay = true,
+  insideModal = false,
 }: {
   open: boolean
   onClose: () => void
   instanceName: string
   provider?: OidcProviderFragment
-  useModalOverlay?: boolean
+  insideModal?: boolean
 }) {
   return (
     <Modal
       open={open}
       onClose={onClose}
-      overlayStyles={{ background: useModalOverlay ? undefined : 'none' }}
+      overlayStyles={{ background: insideModal ? 'none' : undefined }}
       header={`${instanceName} - Edit Plural OIDC clients`}
       size="large"
     >
diff --git a/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClients.tsx b/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClients.tsx
index ce739ff3c..0720aa5fb 100644
--- a/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClients.tsx
+++ b/www/src/components/overview/clusters/plural-cloud/EditPluralOIDCClients.tsx
@@ -55,7 +55,7 @@ export function EditPluralOIDCClientsModal({
         >
           <EditPluralOIDCClients
             instanceName={instance.name}
-            useModalOverlay={false}
+            insideModal
           />
         </ImpersonateServiceAccount>
         <Button
@@ -72,7 +72,7 @@ export function EditPluralOIDCClientsModal({
 
 type TableMetaT = {
   instanceName: string
-  useModalOverlay?: boolean
+  insideModal?: boolean
 }
 
 const columnHelper = createColumnHelper<OidcProviderFragment>()
@@ -110,7 +110,7 @@ const columns = [
     meta: { gridTemplate: 'max-content' },
     cell: function Cell({ row: { original: provider }, table }) {
       const [editOpen, setEditOpen] = useState(false)
-      const { instanceName, useModalOverlay } = table.options.meta as TableMetaT
+      const { instanceName, insideModal } = table.options.meta as TableMetaT
 
       return (
         <>
@@ -123,7 +123,7 @@ const columns = [
             open={editOpen}
             onClose={() => setEditOpen(false)}
             instanceName={instanceName}
-            useModalOverlay={useModalOverlay}
+            insideModal={insideModal}
             provider={provider}
           />
         </>
@@ -134,10 +134,10 @@ const columns = [
 
 export function EditPluralOIDCClients({
   instanceName,
-  useModalOverlay = true,
+  insideModal = false,
 }: {
   instanceName: string
-  useModalOverlay?: boolean
+  insideModal?: boolean
 }) {
   const theme = useTheme()
   const [createOpen, setCreateOpen] = useState(false)
@@ -183,7 +183,7 @@ export function EditPluralOIDCClients({
           onVirtualSliceChange={setVirtualSlice}
           reactVirtualOptions={DEFAULT_REACT_VIRTUAL_OPTIONS}
           reactTableOptions={{
-            meta: { instanceName, useModalOverlay } as TableMetaT,
+            meta: { instanceName, insideModal } as TableMetaT,
           }}
           style={{
             border: 'none',
@@ -192,7 +192,8 @@ export function EditPluralOIDCClients({
           }}
           css={{
             td: {
-              backgroundColor: theme.colors['fill-one'],
+              backgroundColor:
+                theme.colors[insideModal ? 'fill-two' : 'fill-one'],
               borderColor: theme.colors['border-fill-two'],
             },
           }}
@@ -202,7 +203,7 @@ export function EditPluralOIDCClients({
         onClick={() => setCreateOpen(true)}
         css={{
           ...theme.partials.text.body2Bold,
-          backgroundColor: theme.colors['fill-two'],
+          backgroundColor: theme.colors[insideModal ? 'fill-one' : 'fill-zero'],
           alignItems: 'center',
           borderTop: theme.borders['fill-two'],
           display: 'flex',
@@ -214,7 +215,8 @@ export function EditPluralOIDCClients({
           left: 0,
 
           '&:hover': {
-            backgroundColor: theme.colors['fill-one-hover'],
+            backgroundColor:
+              theme.colors[insideModal ? 'fill-one-hover' : 'fill-zero-hover'],
             cursor: 'pointer',
           },
         }}
@@ -226,7 +228,7 @@ export function EditPluralOIDCClients({
         open={createOpen}
         onClose={() => setCreateOpen(false)}
         instanceName={instanceName}
-        useModalOverlay={useModalOverlay}
+        insideModal={insideModal}
       />
     </div>
   )