Feat: added cost input to categorizer

Author: Akalanka47000

src/components/controls/select/seats/categorizer.tsx

@@ -59,6 +59,13 @@ const Categorizer = ({ firstElement, selectedElementIds }) => {
                       className="h-8"
                       onChange={(e) => onUpdateCategory({ ...category, name: e.target.value })}
                     />
+                    <Input
+                      defaultValue={category.cost}
+                      className="h-8 w-5/12"
+                      onChange={(e) =>
+                        onUpdateCategory({ ...category, cost: e.target.value ? parseFloat(e.target.value) : 0 })
+                      }
+                    />
                     <Trash2
                       size={22}
                       className="hover:text-gray-500 flex-shrink-0 cursor-pointer transition-all duration-medium"

src/store/reducers/editor/index.ts

@@ -19,19 +19,22 @@ const initialState = {
       id: uuidv4(),
       name: "Standard",
       color: "#000000",
-      textColor: "#f7f7f7"
+      textColor: "#f7f7f7",
+      cost: 0
     },
     {
       id: uuidv4(),
       name: "Premium",
       color: "#FF0000",
-      textColor: "#f7f7f7"
+      textColor: "#f7f7f7",
+      cost: 100
     },
     {
       id: uuidv4(),
       name: "VIP",
       color: "#0000FF",
-      textColor: "#f7f7f7"
+      textColor: "#f7f7f7",
+      cost: 500
     }
   ],
   sections: [
@@ -146,7 +149,9 @@ export const slice = createSlice({
       action.payload ??= {
         id: uuidv4(),
         name: "New Category",
-        color: "#000000"
+        color: "#000000",
+        textColor: "#f7f7f7",
+        cost: 0
       };
       state.categories.push(action.payload);
     },