From 0dcf13fe555ee56ca9c36657376baa86d0b1c8b8 Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Sun, 20 Feb 2022 07:25:42 -0500
Subject: [PATCH 1/6] updated readme with discord link

---
 README.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/README.md b/README.md
index 3657bd6..1ac20cf 100644
--- a/README.md
+++ b/README.md
@@ -26,3 +26,6 @@ BudgE (pronounced "budgie", like the bird) is an open source "budgeting with env
 
 # Getting Started
 See [linuxserver/docker-BudgE](https://github.com/linuxserver/docker-BudgE).
+
+# Support
+(https://discord.gg/hKJWjDqCBz)[https://discord.gg/hKJWjDqCBz] or through GitHub issues

From 9af7c1e106da1e2b635c9eca7bc3ce4645310a3a Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Sun, 20 Feb 2022 09:58:54 -0500
Subject: [PATCH 2/6] bug fix - don't remove '-' character, otherwise
 everything is considered a positive value!

---
 frontend/src/components/ImportCSV.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/ImportCSV.js b/frontend/src/components/ImportCSV.js
index ff2f9a2..0c596ef 100644
--- a/frontend/src/components/ImportCSV.js
+++ b/frontend/src/components/ImportCSV.js
@@ -120,16 +120,16 @@ export default function ImportCSV({ accountId, open, close }) {
           case 'Ignore':
             break
           case 'Amount':
-            newTransaction.amount = inputToDinero(parseFloat(value.replace(/[^0-9\.]/, '')))
+            newTransaction.amount = inputToDinero(parseFloat(value.replace(/[^0-9\.-]/, '')))
             break
           case 'Inflow':
             if (parseFloat(value) !== 0) {
-              newTransaction.amount = inputToDinero(parseFloat(value.replace(/[^0-9\.]/, '')))
+              newTransaction.amount = inputToDinero(parseFloat(value.replace(/[^0-9\.-]/, '')))
             }
             break
           case 'Outflow':
             if (parseFloat(value) !== 0) {
-              newTransaction.amount = multiply(inputToDinero(parseFloat(value.replace(/[^0-9\.]/, ''))), -1)
+              newTransaction.amount = multiply(inputToDinero(parseFloat(value.replace(/[^0-9\.-]/, ''))), -1)
             }
             break
           case 'Memo':

From b638b1288e24bffbe37328d88b1debd50f68a3d9 Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Sun, 20 Feb 2022 14:53:26 -0500
Subject: [PATCH 3/6] style updates

---
 .../components/AccountTable/AccountTable.js   | 229 +++++++++++++-----
 frontend/src/utils/Currency.js                |   6 +-
 2 files changed, 170 insertions(+), 65 deletions(-)

diff --git a/frontend/src/components/AccountTable/AccountTable.js b/frontend/src/components/AccountTable/AccountTable.js
index f8991a9..f93a4a4 100644
--- a/frontend/src/components/AccountTable/AccountTable.js
+++ b/frontend/src/components/AccountTable/AccountTable.js
@@ -56,15 +56,23 @@ import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank'
 import CheckBoxIcon from '@mui/icons-material/CheckBox'
 import { styled } from '@mui/material/styles'
 import UploadIcon from '@mui/icons-material/Upload'
+import EventIcon from '@mui/icons-material/Event'
 import ImportCSV from '../ImportCSV'
 import AccountTableHeader from './AccountTableHeader'
 import MoreVertIcon from '@mui/icons-material/MoreVert'
 import DeleteOutline from '@mui/icons-material/DeleteOutline'
+import _ from 'lodash'
+
+function DatePickerIcon(props) {
+  const theme = useTheme()
+  return <EventIcon fontSize="small" {...props} sx={{ fontSize: theme.typography.subtitle1.fontSize }} />
+}
 
 const StyledMTableToolbar = styled(MTableToolbar)(({ theme }) => ({
   backgroundColor: theme.palette.background.tableBody,
   minHeight: '0 !important',
   padding: '0 !important',
+  paddingRight: '2px !important',
   margin: '0',
   '& .MuiInputBase-input': {
     padding: '0 !important',
@@ -96,7 +104,7 @@ function StatusIconButton(props) {
 
 export default function Account(props) {
   // const whyDidYouRender = true
-  let tableProps = null
+  let tableProps = {}
 
   const theme = useTheme()
   const dispatch = useDispatch()
@@ -174,35 +182,55 @@ export default function Account(props) {
       defaultSort: 'desc',
       width: 1,
       editComponent: props => (
-        <LocalizationProvider dateAdapter={AdapterDateFns}>
-          <DatePicker
-            label=""
-            value={props.value || null}
-            onChange={props.onChange}
-            InputAdornmentProps={{
-              style: {
-                fontSize: theme.typography.subtitle2.fontSize,
-              },
-            }}
-            renderInput={params => {
-              return (
-                <TextField
-                  sx={{ minWidth: 125 }}
-                  focus={true}
-                  margin="dense"
-                  variant="standard"
-                  {...params}
-                  InputProps={{
-                    style: {
-                      fontSize: theme.typography.subtitle2.fontSize,
-                    },
-                    ...params.InputProps,
-                  }} // font size of input text
-                />
-              )
-            }}
-          />
-        </LocalizationProvider>
+        <Box
+          sx={{
+            ['& .MuiFormControl-root']: { m: 0 },
+          }}
+        >
+          <LocalizationProvider dateAdapter={AdapterDateFns}>
+            <DatePicker
+              label=""
+              value={props.value || null}
+              onChange={props.onChange}
+              InputAdornmentProps={{
+                sx: {
+                  fontSize: theme.typography.caption.fontSize,
+                  [`& .MuiButtonBase-root`]: { p: 0 },
+                  [`& .MuiButtonBase-root`]: { p: 0 },
+                },
+              }}
+              components={{
+                OpenPickerIcon: DatePickerIcon,
+              }}
+              renderInput={params => {
+                return (
+                  <TextField
+                    sx={{ minWidth: 125 }}
+                    focus={true}
+                    margin="dense"
+                    {...params}
+                    InputProps={{
+                      style: {
+                        fontSize: theme.typography.subtitle2.fontSize,
+                      },
+                      ...params.InputProps,
+                    }}
+                    inputProps={{
+                      ...params.inputProps,
+                      form: {
+                        autoComplete: 'off',
+                      },
+                      sx: {
+                        py: '1px',
+                        px: 1,
+                      },
+                    }}
+                  />
+                )
+              }}
+            />
+          </LocalizationProvider>
+        </Box>
       ),
     },
     {
@@ -211,7 +239,10 @@ export default function Account(props) {
       lookup: payeesMap,
       editComponent: props => (
         <Autocomplete
-          sx={{ width: 300 }}
+          sx={{
+            [`& .MuiOutlinedInput-root`]: { p: 0, pt: '1px' },
+            [`& #payee-text-field.MuiOutlinedInput-input`]: { px: 1, py: 0 },
+          }}
           options={payeeIds}
           getOptionLabel={option => {
             if (payeesMap[option]) {
@@ -221,18 +252,22 @@ export default function Account(props) {
             return option
           }}
           // renderOption={(props, option) => <li {...props}>{option.name}</li>}
-          freeSolo
           renderInput={params => (
             <TextField
               {...params}
               label=""
-              variant="standard"
               InputProps={{
                 style: {
                   fontSize: theme.typography.subtitle2.fontSize,
+                  py: 0,
+                  px: 1,
                 },
                 ...params.InputProps,
               }}
+              inputProps={{
+                ...params.inputProps,
+                id: 'payee-text-field',
+              }}
             />
           )}
           value={props.value}
@@ -255,22 +290,7 @@ export default function Account(props) {
             }
             return props.onRowDataChange(newRow)
           }}
-          filterOptions={(options, params) => {
-            const filtered = filter(options, params)
-
-            const { inputValue } = params
-            if (inputValue.match(/New: /)) {
-              return filtered
-            }
-
-            // Suggest the creation of a new value
-            const isExisting = options.some(option => payeesMap[option] === inputValue)
-            if (inputValue !== '' && !isExisting) {
-              filtered.push(`New: ${inputValue}`)
-            }
-
-            return filtered
-          }}
+          noOptionsText={`"${props.value} will be created`}
         />
       ),
       render: rowData => (
@@ -314,17 +334,25 @@ export default function Account(props) {
 
                     return option
                   }}
-                  // sx={{ width: 300 }}
+                  sx={{
+                    [`& .MuiOutlinedInput-root`]: { p: 0, pt: '1px' },
+                    [`& #envelope-text-field.MuiOutlinedInput-input`]: { px: 1, py: 0 },
+                  }}
                   renderInput={params => (
                     <TextField
                       {...params}
-                      variant="standard"
                       InputProps={{
                         style: {
                           fontSize: theme.typography.subtitle2.fontSize,
+                          py: 0,
+                          px: 1,
                         },
                         ...params.InputProps,
                       }}
+                      inputProps={{
+                        ...params.inputProps,
+                        id: 'envelope-text-field',
+                      }}
                     />
                   )}
                   value={props.value}
@@ -360,12 +388,33 @@ export default function Account(props) {
           </span>
         </Tooltip>
       ),
+      editComponent: props => (
+        <TextField
+          {...props}
+          fullWidth
+          inputProps={{
+            sx: {
+              py: 0,
+              px: 1,
+              fontSize: theme.typography.subtitle2.fontSize,
+            },
+          }}
+          InputProps={{
+            sx: {
+              paddingBottom: '1px',
+            },
+          }}
+          onChange={e => {
+            props.onChange(e.target.value)
+          }}
+        />
+      ),
     },
     {
       title: 'Amount',
       field: 'amount',
-      // type: 'currency',
       align: 'right',
+      width: '150px',
       customSort: (a, b) => (greaterThan(a.amount, b.amount) ? -1 : 1),
       initialEditValue: toSnapshot(inputToDinero(0)),
       render: rowData => {
@@ -382,12 +431,26 @@ export default function Account(props) {
         const value = dinero(props.value)
         return (
           <Box sx={{ textAlign: 'right' }}>
-            <MTableEditField
+            <TextField
               {...props}
-              variant="standard"
+              fullWidth
+              inputProps={{
+                sx: {
+                  textAlign: 'right',
+                  py: 0,
+                  px: 1,
+                  fontSize: theme.typography.subtitle2.fontSize,
+                  // height: 1,
+                },
+              }}
+              InputProps={{
+                sx: {
+                  paddingBottom: '1px',
+                },
+              }}
               value={toUnit(value, { digits: 2 })}
-              onChange={value => {
-                props.onChange(toSnapshot(inputToDinero(value)))
+              onChange={e => {
+                props.onChange(toSnapshot(inputToDinero(e.target.value)))
               }}
               // onFocus={focusOutflowField}
             />
@@ -402,7 +465,8 @@ export default function Account(props) {
       title: '',
       field: 'status',
       width: '1px',
-      editComponent: props => <></>, // Doing this so that the button isn't available to click when in edit mode
+      sorting: false,
+      editComponent: props => <Box sx={{ width: 0 }}></Box>, // Doing this so that the button isn't available to click when in edit mode
       render: rowData => {
         let statusIcon = <></>
         let tooltipText = ''
@@ -422,9 +486,11 @@ export default function Account(props) {
         }
 
         return (
-          <Tooltip title={tooltipText}>
-            <StatusIconButton rowData={rowData} setTransactionStatus={setTransactionStatus} statusIcon={statusIcon} />
-          </Tooltip>
+          <Box sx={{ textAlign: 'center' }}>
+            <Tooltip title={tooltipText}>
+              <StatusIconButton rowData={rowData} setTransactionStatus={setTransactionStatus} statusIcon={statusIcon} />
+            </Tooltip>
+          </Box>
         )
       },
       customExport: rowData => {
@@ -442,6 +508,8 @@ export default function Account(props) {
     col.cellStyle = {
       paddingTop: 0,
       paddingBottom: 0,
+      paddingLeft: 2,
+      paddingRight: 2,
     }
     return col
   })
@@ -888,8 +956,9 @@ export default function Account(props) {
               <StyledMTableToolbar
                 {...{ ...props, actions: [] }}
                 showTextRowsSelected={false}
+                searchFieldVariant="outlined"
                 localization={{
-                  searchPlaceholder: 'Search transactions',
+                  searchPlaceholder: 'Filter',
                 }}
               />
 
@@ -908,11 +977,43 @@ export default function Account(props) {
           EditRow: props => <MTableEditRow {...props} />,
           Actions: props => {
             console.log(props)
-            if (typeof props.actions[1] !== 'function') {
-              return <MTableActions {...props} />
+            if (props.disabled || !_.get(props, 'data.id', false)) {
+              return <></>
             }
 
-            return <></>
+            if (!_.get(props, 'data.tableData.editing', false)) {
+              return (
+                <PopupState variant="popover" popupId="demo-popup-menu">
+                  {popupState => (
+                    <Box onClick={e => e.stopPropagation()} sx={{ width: 20 }}>
+                      <IconButton size="small" {...bindTrigger(popupState)} sx={{ p: 0 }}>
+                        <MoreVertIcon fontSize="small" />
+                      </IconButton>
+
+                      <Menu {...bindMenu(popupState)}>
+                        <MenuItem
+                          onClick={e => {
+                            props.actions[0]().onClick(e, props.data) // <---- trigger edit event
+                          }}
+                        >
+                          Edit
+                        </MenuItem>
+
+                        <MenuItem
+                          onClick={e => {
+                            props.actions[1]().onClick(e, props.data) // <---- trigger edit event
+                          }}
+                        >
+                          Delete
+                        </MenuItem>
+                      </Menu>
+                    </Box>
+                  )}
+                </PopupState>
+              )
+            }
+
+            return <MTableActions {...props} />
           },
         }}
         icons={TableIcons}
diff --git a/frontend/src/utils/Currency.js b/frontend/src/utils/Currency.js
index bafcccd..134b22e 100644
--- a/frontend/src/utils/Currency.js
+++ b/frontend/src/utils/Currency.js
@@ -1,4 +1,4 @@
-import { dinero, toFormat, isPositive, isNegative, multiply } from 'dinero.js'
+import { dinero, toFormat, isPositive, isNegative, multiply, toUnit } from 'dinero.js'
 import { USD } from '@dinero.js/currencies'
 
 export function inputToDinero(amount) {
@@ -24,6 +24,10 @@ export function valueToDinero(value) {
   return dinero({ amount: value, currency: USD })
 }
 
+export function valueToUnit(value) {
+  return toUnit(valueToDinero(value), { digits: 2 })
+}
+
 export function dineroToValue(dineroObj) {
   return dineroObj.toJSON().amount
 }

From 169974825a52ab5e7a40147862a2034c205e825c Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Sun, 20 Feb 2022 14:57:31 -0500
Subject: [PATCH 4/6] version bump

---
 backend/package.json       |  2 +-
 frontend/package-lock.json | 94 --------------------------------------
 frontend/package.json      |  4 +-
 3 files changed, 3 insertions(+), 97 deletions(-)

diff --git a/backend/package.json b/backend/package.json
index 0528f47..b4801f4 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "BudgE",
-  "version": "1.0.0",
+  "version": "0.0.2",
   "description": "",
   "main": "dist/index.js",
   "scripts": {
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index ce88a25..1e8e934 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -6400,15 +6400,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/bindings": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
-      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
-      "optional": true,
-      "dependencies": {
-        "file-uri-to-path": "1.0.0"
-      }
-    },
     "node_modules/bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -7984,35 +7975,11 @@
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz",
       "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA=="
     },
-    "node_modules/csv": {
-      "version": "6.0.5",
-      "resolved": "https://registry.npmjs.org/csv/-/csv-6.0.5.tgz",
-      "integrity": "sha512-VyII851P4BvzMsXenhtR7g3mARmZ3HvBX16PD85E8IOoxyvNT9e74egbfdkYBj5SGHh1LphCWXeQvskijH+kfg==",
-      "dependencies": {
-        "csv-generate": "^4.0.4",
-        "csv-parse": "^5.0.4",
-        "csv-stringify": "^6.0.5",
-        "stream-transform": "^3.0.4"
-      },
-      "engines": {
-        "node": ">= 0.1.90"
-      }
-    },
-    "node_modules/csv-generate": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/csv-generate/-/csv-generate-4.0.4.tgz",
-      "integrity": "sha512-6/0FOBbF4O+EBSAYsfOXBjIFhyPpfeeeuWEM4XJQhc/6TvDDL9AGFQNPh2SKlFx7VYERBDmZAWnITgaa+z4BJA=="
-    },
     "node_modules/csv-parse": {
       "version": "5.0.4",
       "resolved": "https://registry.npmjs.org/csv-parse/-/csv-parse-5.0.4.tgz",
       "integrity": "sha512-5AIdl8l6n3iYQYxan5djB5eKDa+vBnhfWZtRpJTcrETWfVLYN0WSj3L9RwvgYt+psoO77juUr8TG8qpfGZifVQ=="
     },
-    "node_modules/csv-stringify": {
-      "version": "6.0.5",
-      "resolved": "https://registry.npmjs.org/csv-stringify/-/csv-stringify-6.0.5.tgz",
-      "integrity": "sha512-7xpV3uweJCFF/Ssn56l3xsR/k2r3UqszwjEhej9qEn2cCPzyK1WyHCgoUVzBA792x8HbwonNX7CU9XM2K5s5yw=="
-    },
     "node_modules/cyclist": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@@ -10325,12 +10292,6 @@
         "url": "https://opencollective.com/webpack"
       }
     },
-    "node_modules/file-uri-to-path": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
-      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
-      "optional": true
-    },
     "node_modules/filefy": {
       "version": "0.1.11",
       "resolved": "https://registry.npmjs.org/filefy/-/filefy-0.1.11.tgz",
@@ -15015,12 +14976,6 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
-    "node_modules/nan": {
-      "version": "2.15.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.15.0.tgz",
-      "integrity": "sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==",
-      "optional": true
-    },
     "node_modules/nanoid": {
       "version": "3.1.30",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
@@ -20001,11 +19956,6 @@
       "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.1.tgz",
       "integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ=="
     },
-    "node_modules/stream-transform": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/stream-transform/-/stream-transform-3.0.4.tgz",
-      "integrity": "sha512-g2jbk1hs3GiF3oHZLbR7Fph/PXh/3xHoz/D8aR2oHySE4xVUvNeTGqihhb1vxFjYyu4inqiTfT42g2MHBjjx0g=="
-    },
     "node_modules/strict-uri-encode": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
@@ -27940,14 +27890,6 @@
       "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
       "optional": true
     },
-    "bindings": {
-      "version": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
-      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
-      "optional": true,
-      "requires": {
-        "file-uri-to-path": "1.0.0"
-      }
-    },
     "bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -29215,31 +29157,11 @@
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz",
       "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA=="
     },
-    "csv": {
-      "version": "https://registry.npmjs.org/csv/-/csv-6.0.5.tgz",
-      "integrity": "sha512-VyII851P4BvzMsXenhtR7g3mARmZ3HvBX16PD85E8IOoxyvNT9e74egbfdkYBj5SGHh1LphCWXeQvskijH+kfg==",
-      "requires": {
-        "csv-generate": "^4.0.4",
-        "csv-parse": "^5.0.4",
-        "csv-stringify": "^6.0.5",
-        "stream-transform": "^3.0.4"
-      }
-    },
-    "csv-generate": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/csv-generate/-/csv-generate-4.0.4.tgz",
-      "integrity": "sha512-6/0FOBbF4O+EBSAYsfOXBjIFhyPpfeeeuWEM4XJQhc/6TvDDL9AGFQNPh2SKlFx7VYERBDmZAWnITgaa+z4BJA=="
-    },
     "csv-parse": {
       "version": "5.0.4",
       "resolved": "https://registry.npmjs.org/csv-parse/-/csv-parse-5.0.4.tgz",
       "integrity": "sha512-5AIdl8l6n3iYQYxan5djB5eKDa+vBnhfWZtRpJTcrETWfVLYN0WSj3L9RwvgYt+psoO77juUr8TG8qpfGZifVQ=="
     },
-    "csv-stringify": {
-      "version": "6.0.5",
-      "resolved": "https://registry.npmjs.org/csv-stringify/-/csv-stringify-6.0.5.tgz",
-      "integrity": "sha512-7xpV3uweJCFF/Ssn56l3xsR/k2r3UqszwjEhej9qEn2cCPzyK1WyHCgoUVzBA792x8HbwonNX7CU9XM2K5s5yw=="
-    },
     "cyclist": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@@ -31000,12 +30922,6 @@
         }
       }
     },
-    "file-uri-to-path": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
-      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
-      "optional": true
-    },
     "filefy": {
       "version": "0.1.11",
       "resolved": "https://registry.npmjs.org/filefy/-/filefy-0.1.11.tgz",
@@ -34557,11 +34473,6 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
-    "nan": {
-      "version": "https://registry.npmjs.org/nan/-/nan-2.15.0.tgz",
-      "integrity": "sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==",
-      "optional": true
-    },
     "nanoid": {
       "version": "3.1.30",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
@@ -38541,11 +38452,6 @@
       "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.1.tgz",
       "integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ=="
     },
-    "stream-transform": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/stream-transform/-/stream-transform-3.0.4.tgz",
-      "integrity": "sha512-g2jbk1hs3GiF3oHZLbR7Fph/PXh/3xHoz/D8aR2oHySE4xVUvNeTGqihhb1vxFjYyu4inqiTfT42g2MHBjjx0g=="
-    },
     "strict-uri-encode": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 8256d14..cc69337 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "wenab-react-js",
-  "version": "0.1.0",
+  "name": "BudgE",
+  "version": "0.0.2",
   "private": true,
   "dependencies": {
     "@dinero.js/currencies": "^2.0.0-alpha.8",

From 6927a645ea615a97a9884a7baddd0b20289c3f61 Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Mon, 21 Feb 2022 09:11:04 -0500
Subject: [PATCH 5/6] ui ux tweaks

---
 frontend/src/components/AccountDetails.js     | 35 ++++++++++---------
 .../components/AccountTable/AccountTable.js   |  3 +-
 frontend/src/pages/Account.js                 |  2 +-
 3 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/frontend/src/components/AccountDetails.js b/frontend/src/components/AccountDetails.js
index 21edc6f..289018a 100644
--- a/frontend/src/components/AccountDetails.js
+++ b/frontend/src/components/AccountDetails.js
@@ -23,6 +23,7 @@ import CardContent from '@mui/material/CardContent'
 import CardActions from '@mui/material/CardActions'
 import Table from '@mui/material/Table'
 import TableContainer from '@mui/material/TableContainer'
+import TableBody from '@mui/material/TableBody'
 import TableRow from '@mui/material/TableRow'
 import TableCell from '@mui/material/TableCell'
 import { add } from 'dinero.js'
@@ -185,25 +186,27 @@ export default function BudgetDetails({ accountId, name }) {
           <CardContent sx={{ p: '10px !important' }}>
             <TableContainer>
               <Table size="small">
-                <TableRow>
-                  <TableCell>Transactions</TableCell>
-                  <TableCell sx={{ textAlign: 'right' }}>{transactions.length}</TableCell>
-                </TableRow>
+                <TableBody>
+                  <TableRow>
+                    <TableCell>Transactions</TableCell>
+                    <TableCell sx={{ textAlign: 'right' }}>{transactions.length}</TableCell>
+                  </TableRow>
 
-                <TableRow>
-                  <TableCell>Pending</TableCell>
-                  <TableCell sx={{ textAlign: 'right' }}>{pending}</TableCell>
-                </TableRow>
+                  <TableRow>
+                    <TableCell>Pending</TableCell>
+                    <TableCell sx={{ textAlign: 'right' }}>{pending}</TableCell>
+                  </TableRow>
 
-                <TableRow>
-                  <TableCell>Income</TableCell>
-                  <TableCell sx={{ textAlign: 'right' }}>{intlFormat(income)}</TableCell>
-                </TableRow>
+                  <TableRow>
+                    <TableCell>Income</TableCell>
+                    <TableCell sx={{ textAlign: 'right' }}>{intlFormat(income)}</TableCell>
+                  </TableRow>
 
-                <TableRow>
-                  <TableCell>Activity</TableCell>
-                  <TableCell sx={{ textAlign: 'right' }}>{intlFormat(activity)}</TableCell>
-                </TableRow>
+                  <TableRow>
+                    <TableCell>Activity</TableCell>
+                    <TableCell sx={{ textAlign: 'right' }}>{intlFormat(activity)}</TableCell>
+                  </TableRow>
+                </TableBody>
               </Table>
             </TableContainer>
           </CardContent>
diff --git a/frontend/src/components/AccountTable/AccountTable.js b/frontend/src/components/AccountTable/AccountTable.js
index f93a4a4..4be642e 100644
--- a/frontend/src/components/AccountTable/AccountTable.js
+++ b/frontend/src/components/AccountTable/AccountTable.js
@@ -920,6 +920,7 @@ export default function Account(props) {
           headerStyle: {
             textTransform: 'uppercase',
             fontSize: theme.typography.caption.fontSize,
+            padding: 0,
           },
           headerSelectionProps: {
             size: 'small',
@@ -985,7 +986,7 @@ export default function Account(props) {
               return (
                 <PopupState variant="popover" popupId="demo-popup-menu">
                   {popupState => (
-                    <Box onClick={e => e.stopPropagation()} sx={{ width: 20 }}>
+                    <Box onClick={e => e.stopPropagation()} sx={{ width: '100%', textAlign: 'center' }}>
                       <IconButton size="small" {...bindTrigger(popupState)} sx={{ p: 0 }}>
                         <MoreVertIcon fontSize="small" />
                       </IconButton>
diff --git a/frontend/src/pages/Account.js b/frontend/src/pages/Account.js
index 1c865f5..bb016c7 100644
--- a/frontend/src/pages/Account.js
+++ b/frontend/src/pages/Account.js
@@ -48,7 +48,7 @@ export default function Account(props) {
           height: '100%',
         }}
       >
-        <AccountDetails accountId={params.accountId} name={account.name} />
+        {account && <AccountDetails accountId={params.accountId} name={account.name} />}
       </Box>
     </Stack>
   )

From 235aa0e98b18e17147cbc1992ff6aa7dc8af7994 Mon Sep 17 00:00:00 2001
From: Alex Phillips <ahp118@gmail.com>
Date: Mon, 21 Feb 2022 20:29:26 -0500
Subject: [PATCH 6/6] refresh accounts and categories on account add for CC
 account and category

---
 frontend/src/components/AddAccountDialog.js | 11 ++++++---
 frontend/src/redux/slices/BudgetMonths.js   | 25 +++++++++------------
 2 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/frontend/src/components/AddAccountDialog.js b/frontend/src/components/AddAccountDialog.js
index 7c96415..96cd7ee 100644
--- a/frontend/src/components/AddAccountDialog.js
+++ b/frontend/src/components/AddAccountDialog.js
@@ -5,16 +5,19 @@ import Dialog from '@mui/material/Dialog'
 import DialogActions from '@mui/material/DialogActions'
 import DialogContent from '@mui/material/DialogContent'
 import DialogTitle from '@mui/material/DialogTitle'
-import { createAccount } from '../redux/slices/Accounts'
-import { useDispatch } from 'react-redux'
+import { createAccount, fetchAccounts } from '../redux/slices/Accounts'
+import { useDispatch, useSelector } from 'react-redux'
 import MenuItem from '@mui/material/MenuItem'
 import { fetchCategories } from '../redux/slices/CategoryGroups'
 import { refreshBudget } from '../redux/slices/Budgets'
+import { refreshBudgetMonth } from '../redux/slices/BudgetMonths'
 import { inputToDinero } from '../utils/Currency'
 
 const accountTypes = ['Bank', 'Credit Card', 'Off Budget Account']
 
 export default function AddAccountDialog(props) {
+  const month = useSelector(state => state.budgets.currentMonth)
+
   /**
    * State block
    */
@@ -41,9 +44,11 @@ export default function AddAccountDialog(props) {
     )
 
     dispatch(refreshBudget())
+    dispatch(fetchAccounts())
 
     // If adding a credit card, update all categories since we have added a payment category for it
-    if (accountType === accountTypes[1]) {
+    if (accountType === 1) {
+      console.log('fetching cats')
       dispatch(fetchCategories())
     }
     reset()
diff --git a/frontend/src/redux/slices/BudgetMonths.js b/frontend/src/redux/slices/BudgetMonths.js
index 3fbce3a..d6585fe 100644
--- a/frontend/src/redux/slices/BudgetMonths.js
+++ b/frontend/src/redux/slices/BudgetMonths.js
@@ -18,20 +18,17 @@ export const fetchBudgetMonth = createAsyncThunk('budgetMonths/fetchMonth', asyn
   }
 })
 
-export const refreshBudgetMonth = createAsyncThunk(
-  'budgetMonths/refreshMonth',
-  async ({ month, categoryId }, { getState }) => {
-    const store = getState()
-    const budgetMonth = await api.fetchBudgetMonth(store.budgets.activeBudgetId, month)
-    // console.log(budgetMonth)
-    // budgetMonth.categories = budgetMonth.categories.filter(categoryMonth => categoryMonth.categoryId === categoryId)
-    const normalized = normalize(budgetMonth, budgetMonthEntity)
-    return {
-      month,
-      entities: normalized.entities,
-    }
-  },
-)
+export const refreshBudgetMonth = createAsyncThunk('budgetMonths/refreshMonth', async ({ month }, { getState }) => {
+  const store = getState()
+  const budgetMonth = await api.fetchBudgetMonth(store.budgets.activeBudgetId, month)
+  // console.log(budgetMonth)
+  // budgetMonth.categories = budgetMonth.categories.filter(categoryMonth => categoryMonth.categoryId === categoryId)
+  const normalized = normalize(budgetMonth, budgetMonthEntity)
+  return {
+    month,
+    entities: normalized.entities,
+  }
+})
 
 export const fetchBudgetMonths = createAsyncThunk('budgetMonths/fetchMonths', async ({ month }, { getState }) => {
   const store = getState()