Revert "Added start and end icon props to buttons to allow for images, made p…"

Client/src/Components/Button/index.jsx

@@ -24,35 +24,22 @@ const levelConfig = {
  * @typedef {Object} Props
  * @property {'primary' | 'secondary' | 'tertiary' | 'error'} level - The level of the button
  * @property {string} label - The label of the button
- * @property {React.ReactNode} [startIcon] - Icon prepended to the label
- * @property {React.ReactNode} [endIcon] - Icon appended to the button label
  * @property {boolean} [disabled] - Whether the button is disabled
- * @property {(event: React.MouseEvent<HTMLButtonElement>) => void} [onClick] - The click handler of the button
  */
 
-const Button = ({ level, label, disabled, startIcon, endIcon, onClick }) => {
+const Button = ({ level, label, disabled }) => {
   const { variant, color } = levelConfig[level];
   return (
-    <MuiButton
-      variant={variant}
-      color={color}
-      disabled={disabled}
-      startIcon={startIcon}
-      endIcon={endIcon}
-      onClick={onClick}
-    >
+    <MuiButton variant={variant} color={color} disabled={disabled}>
       {label}
     </MuiButton>
   );
 };
 
 Button.propTypes = {
-  level: PropTypes.oneOf(["primary", "secondary", "tertiary", "error"]),
+  level: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
-  startIcon: PropTypes.node,
-  endIcon: PropTypes.node,
   disabled: PropTypes.bool,
-  onClick: PropTypes.func,
 };
 
 export default Button;

Client/src/Pages/Home/index.jsx

@@ -2,7 +2,6 @@ import React from "react";
 import DropdownTeamMember from "../../Components/DropdownTeamMember";
 import "./index.css";
 import Button from "../../Components/Button";
-import SettingsIcon from "@mui/icons-material/Settings";
 
 const Home = () => {
   return (
@@ -14,24 +13,10 @@ const Home = () => {
       >
         <h4>Buttons</h4>
         <div>
-          <Button
-            level="primary"
-            label="Primary"
-            onClick={() => {
-              alert("Primary");
-            }}
-          />
-          <Button
-            level="secondary"
-            label="Secondary"
-            onClick={() => alert("Secondary")}
-          />
-          <Button
-            level="tertiary"
-            label="Tertiary"
-            onClick={() => alert("Tertiary")}
-          />
-          <Button level="error" label="Error" onClick={() => alert("Error")} />
+          <Button level="primary" label="Primary" />
+          <Button level="secondary" label="Secondary" />
+          <Button level="tertiary" label="Tertiary" />
+          <Button level="error" label="Error" />
         </div>
         <h4>Disabled Buttons</h4>
         <div>
@@ -40,19 +25,6 @@ const Home = () => {
           <Button level="tertiary" label="Tertiary" disabled />
           <Button level="error" label="Error" disabled />
         </div>
-        <h4>Image Button</h4>
-        <div>
-          <Button
-            level="tertiary"
-            label="Configure"
-            startIcon={<SettingsIcon />}
-          />
-          <Button
-            level="tertiary"
-            label="Configure"
-            endIcon={<SettingsIcon />}
-          />
-        </div>
       </div>
     </>
   );