feat(client): add error color to 'Save failed!' warning

neopostmodern · Aug 10, 2022 · 88d6d73 · 88d6d73
1 parent 19fb53c
commit 88d6d73
Showing 1 changed file with 8 additions and 3 deletions.
diff --git a/client/src/renderer/components/NetworkOperationsIndicator.tsx b/client/src/renderer/components/NetworkOperationsIndicator.tsx
@@ -16,10 +16,13 @@ const DISPLAY_SAVED_NOTIFICATION_LENGTH = 1000;
 export const NetworkIndicatorContainer = ({
   children,
   align = 'right',
-}: PropsWithChildren<{ align?: 'left' | 'right' }>) => (
+  color = 'inherit',
+}: PropsWithChildren<{ align?: 'left' | 'right'; color?: string }>) => (
   <Box sx={{ position: 'relative' }}>
     <Box sx={{ position: 'absolute', bottom: 0, [align]: 0 }}>
-      <Typography variant="caption">{children}</Typography>
+      <Typography variant="caption" color={color}>
+        {children}
+      </Typography>
     </Box>
   </Box>
 );
@@ -83,7 +86,9 @@ const NetworkOperationsIndicator = ({
 
   return (
     <>
-      <NetworkIndicatorContainer>{message}</NetworkIndicatorContainer>
+      <NetworkIndicatorContainer color={isError ? 'error' : undefined}>
+        {message}
+      </NetworkIndicatorContainer>
       <ErrorSnackbar error={mutation?.error} actionDescription="save" />
     </>
   );