From ac97e2ffd9f4b2b7816d15432f3f804b3508957d Mon Sep 17 00:00:00 2001
From: Rafael Taranto <rafael.taranto@protonmail.com>
Date: Tue, 22 Apr 2025 14:34:23 +0100
Subject: [PATCH] refactor: use theme for chips

---
 new-lamassu-admin/src/components/Chip.jsx     | 34 -------------------
 .../src/components/SearchFilter.jsx           |  2 +-
 .../src/components/inputs/cashbox/Cashbox.jsx |  7 ++--
 .../inputs/cashbox/Cashbox.styles.js          |  3 --
 .../src/pages/Maintenance/CashUnitDetails.jsx |  2 +-
 new-lamassu-admin/src/styling/theme.js        | 21 +++++++++---
 6 files changed, 20 insertions(+), 49 deletions(-)
 delete mode 100644 new-lamassu-admin/src/components/Chip.jsx

diff --git a/new-lamassu-admin/src/components/Chip.jsx b/new-lamassu-admin/src/components/Chip.jsx
deleted file mode 100644
index 6358047d..00000000
--- a/new-lamassu-admin/src/components/Chip.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import Chip from '@mui/material/Chip'
-import { withStyles } from '@mui/styles'
-import React, { memo } from 'react'
-
-import {
-  fontColor,
-  inputFontWeight,
-  subheaderColor,
-  smallestFontSize,
-  inputFontFamily
-} from 'src/styling/variables'
-
-const styles = theme => ({
-  root: {
-    backgroundColor: subheaderColor,
-    borderRadius: 4,
-    margin: theme.spacing(0.5, 0.25),
-    height: 18
-  },
-  label: {
-    fontSize: smallestFontSize,
-    color: fontColor,
-    fontWeight: inputFontWeight,
-    fontFamily: inputFontFamily,
-    paddingRight: 4,
-    paddingLeft: 4
-  }
-})
-
-const LsChip = memo(({ classes, ...props }) => (
-  <Chip size="small" classes={classes} {...props} />
-))
-
-export default withStyles(styles)(LsChip)
diff --git a/new-lamassu-admin/src/components/SearchFilter.jsx b/new-lamassu-admin/src/components/SearchFilter.jsx
index 3089f637..d16891e4 100644
--- a/new-lamassu-admin/src/components/SearchFilter.jsx
+++ b/new-lamassu-admin/src/components/SearchFilter.jsx
@@ -1,6 +1,6 @@
 import { makeStyles } from '@mui/styles'
+import Chip from '@mui/material/Chip'
 import React from 'react'
-import Chip from 'src/components/Chip'
 import { P, Label3 } from 'src/components/typography'
 import CloseIcon from 'src/styling/icons/action/close/zodiac.svg?react'
 import FilterIcon from 'src/styling/icons/button/filter/white.svg?react'
diff --git a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.jsx b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.jsx
index 81d90e83..e50f2fd9 100644
--- a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.jsx
+++ b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.jsx
@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
+import Chip from '@mui/material/Chip'
 import classnames from 'classnames'
 import React from 'react'
-import Chip from 'src/components/Chip'
 import { Info2, Label1, Label2 } from 'src/components/typography'
 
 import { numberToFiatAmount } from 'src/utils/number'
@@ -136,10 +136,7 @@ const CashOut = ({
           <div className={classes.col2}>
             <div className={classes.innerRow}>
               <Info2 className={classes.noMarginText}>{notes}</Info2>
-              <Chip
-                className={classes.chip}
-                label={`${denomination} ${currency.code}`}
-              />
+              <Chip label={`${denomination} ${currency.code}`} />
             </div>
             <div className={classes.innerRow}>
               <Label1 className={classes.noMarginText}>
diff --git a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js
index df06ed6b..cbb5c292 100644
--- a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js
+++ b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js
@@ -79,9 +79,6 @@ const gridStyles = {
   },
   link: {
     marginTop: spacer
-  },
-  chip: {
-    margin: [[0, 0, 0, 7]]
   }
 }
 
diff --git a/new-lamassu-admin/src/pages/Maintenance/CashUnitDetails.jsx b/new-lamassu-admin/src/pages/Maintenance/CashUnitDetails.jsx
index 1d027869..290cd127 100644
--- a/new-lamassu-admin/src/pages/Maintenance/CashUnitDetails.jsx
+++ b/new-lamassu-admin/src/pages/Maintenance/CashUnitDetails.jsx
@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
+import Chip from '@mui/material/Chip'
 import * as R from 'ramda'
 import React from 'react'
-import Chip from 'src/components/Chip'
 import { Label1, TL2 } from 'src/components/typography'
 
 import { CashOut } from 'src/components/inputs'
diff --git a/new-lamassu-admin/src/styling/theme.js b/new-lamassu-admin/src/styling/theme.js
index 83346419..1230c550 100644
--- a/new-lamassu-admin/src/styling/theme.js
+++ b/new-lamassu-admin/src/styling/theme.js
@@ -10,10 +10,13 @@ import {
   offColor,
   subheaderColor,
   fontSize3,
-  fontSize5,
   zircon,
   zircon2,
-  primaryColor, disabledColor2, disabledColor
+  primaryColor,
+  disabledColor2,
+  disabledColor,
+  smallestFontSize,
+  inputFontWeight
 } from './variables'
 
 const { p } = typographyStyles
@@ -150,11 +153,19 @@ theme = createTheme(theme, {
     },
     MuiChip: {
       styleOverrides: {
+        root: {
+          backgroundColor: subheaderColor,
+          borderRadius: 4,
+          margin: theme.spacing(0.5, 0.25),
+          height: 18
+        },
         label: {
-          paddingLeft: 4,
-          paddingRight: 4,
+          fontSize: smallestFontSize,
           color: fontColor,
-          fontSize: fontSize5
+          fontWeight: inputFontWeight,
+          fontFamily: inputFontFamily,
+          paddingRight: 4,
+          paddingLeft: 4
         }
       }
     },