SCEats Admin Dashboard #1602
SCEats Admin Dashboard #1602
Conversation
* fixed youtube footer icon to match fill color with discord icon and github icon * added spacing above project-names to ensure equivalent spacing above and below the project name text
* add node exporter to prod docker compose yml * rename to clark-node-exporter * rename pt 2
* minor ui fixes: footer button color, project name spacing (#1532) * fixed youtube footer icon to match fill color with discord icon and github icon * added spacing above project-names to ensure equivalent spacing above and below the project name text * add node exporter to prod docker compose yml (#1540) * add node exporter to prod docker compose yml * rename to clark-node-exporter * rename pt 2 --------- Co-authored-by: Naya Singhania <naya.singhania@gmail.com> Co-authored-by: Evan Ugarte <36345325+evanugarte@users.noreply.github.com>
brendan-ly
added
the
Front End
al3xbro
left a comment
al3xbro
left a comment
There was a problem hiding this comment.
great job on the code guys. make sure you address each comment and apply it to other parts of the code as well. i mentioned each issue at least once, but didn't highlight every single occurance
| <div className="label"> | ||
| <span className="label-text">Type</span> | ||
| </div> | ||
| <select onChange= {e => setType(e.target.value)} className="select select-bordered w-full max-w-md"> |
| const [foods, setFoods] = useState([]); | ||
| const [name, setName] = useState(); | ||
| const [type, setType] = useState(); | ||
| const [photo, setPhoto] = useState(); | ||
| const [price, setPrice] = useState(); | ||
| const [quantity, setQuantity] = useState(); | ||
| const [expiration, setExpiration] = useState(); | ||
| const [filter, setFilter] = useState('All'); | ||
| const [searchTerm, setSearchTerm] = useState(); | ||
| const [foodToDelete, setFoodToDelete] = useState({ | ||
| name: '', | ||
| type: '', | ||
| photo: '', | ||
| price: '', | ||
| quantity: '', | ||
| expiration: '' | ||
| }); | ||
|
|
||
| const [deleteID, setDeleteID] = useState(null); | ||
|
|
||
| const [editingId, setEditingId] = useState(null); | ||
| const [editedFood, setEditedFood] = useState({ | ||
| name: '', | ||
| type: '', | ||
| photo: '', | ||
| price: '', | ||
| quantity: '', | ||
| expiration: '' | ||
| }); |
There was a problem hiding this comment.
this is a crazy amount of states. i don't think most of these need to be in the same component. i haven't read all the code, but if it needs to be, then the component was designed poorly. consider compartmentalizing them
There was a problem hiding this comment.
this file is waaayyyy too big. consider placing small items (like buttons and their functions) into separate files, and reusing them instead of copy pasting html. most of the time, copy pasting code means you're violating DRY.
react calls for atomic design pattern (that's why the logo is an atom). since that would require way too many changes, let's ignore that, but keep the spirit of atomic design alive in our code. just try splitting up these files. most react components should not be more than 100 lines
Implemented the admin frontend dashboard for SCEats to view, manage, and delete snacks for SCE's snack inventory.
