Change attendance types and update deps

.github/workflows/azure-static-web-apps-proud-meadow-082953800.yml

@@ -33,7 +33,7 @@ jobs:
         # Pick API URL by branch name
         - name: Select API base URL
           run: |
-            if [ "${{ github.ref_name }}" = "Develop" ]; then
+            if [ "${{ github.ref_name }}" = "develop" ] || [ "${{ github.ref_name }}" = "Feature" ]; then
               echo "VITE_API_BASE_URL=${{ secrets.API_URL_STAGING }}" >> $GITHUB_ENV
             else
               echo "VITE_API_BASE_URL=${{ secrets.API_URL_PROD }}" >> $GITHUB_ENV

.github/workflows/develop_jrfbattendanceappdev.yml

@@ -5,7 +5,7 @@ name: Build and deploy API (staging) - JRFBAttendanceAppDev
 on:
   workflow_dispatch:
   push:
-    branches: [ Develop ]
+    branches: [ Develop, Feature ]
 
 concurrency:
   group: api-staging-${{ github.ref }}

.gitignore

@@ -2,4 +2,7 @@
 .vscode
 .deployment
 dist
-node_modules
+node_modules
+.dockerignore
+Dockerfile.dev
+docker-compose.yml

api/src/index.ts

@@ -20,6 +20,7 @@ dotenv.config();
 
 const app = express();
 const port = process.env.PORT || 8080;
+const isProd = process.env.NODE_ENV === "production";
 const DB_NAME = process.env.DB_NAME;
 const cosmosDbUri = process.env.COSMOS_DB_URI;
 const sessionStoreUrl = process.env.SESSION_STORE_URL
@@ -60,11 +61,12 @@ app.use(
     resave: false,
     saveUninitialized: false,
     proxy: true,
+
     cookie: {
-      httpOnly: true,
-      secure: true,
-      sameSite: 'none',
-      maxAge: 60 * 60 * 1000, //1 hour
+    httpOnly: true,
+    secure: isProd,
+    sameSite: isProd ? "none" : "lax",
+    maxAge: 60 * 60 * 1000, //1 hour
     },
   }),
 );

frontend/src/Pages/Attendance/Non-op-page.jsx

@@ -6,12 +6,8 @@ import {useCsrfToken} from "../../Components/csrfHelper.jsx"
 import CheckboxContainer from '../../Components/checkboxContainer.jsx'
 
 const activities = [
-  "Training",
   "Meeting",
-  "Maintenance",
   "Community-Engagement",
-  "BA-Checks",
-  "Chainsaw-Checks",
   "Other-Non-operational"
 ];
 
@@ -29,8 +25,6 @@ export default function OperationalPage() {
   useEffect(() => {
       if (csrfToken) sessionStorage.setItem("csrf", csrfToken);
     }, [csrfToken]);
-  const [baType, setBaType] = useState("");
-  const [chainsawType, setChainsawType] = useState("");
   const [otherType, setOtherType] = useState("")
   const [selectedActivity, setSelectedActivity] = useState(sessionStorage.getItem("activity") || "");
   const [date, setDate] = useState("");
@@ -61,32 +55,14 @@ export default function OperationalPage() {
     username = username.replace(/\./g, " ");
 
     const activitySelection = 'Non-Operational'
-    let payloads;
-
-    if (activity === "BA-Checks") {
-      payloads = 
-        baType === "All Vehicles"
-          ? ["Cat 1", "Pumper"]
-          : [baType]
-    } else if (activity === "Chainsaw-Checks") {
-        payloads =
-          chainsawType === "All Vehicles"
-            ? ["Cat 1", "Pumper", "Cat 9"]
-            :[chainsawType]
-    } else{
-      payloads = [null]
-    }
     try {
-      let finalresponse;
-      for (const type of payloads){    
+      let finalresponse;   
         const data = {
         name: username,
         operational: activitySelection,
         activity,
         roles: selectedRoles,
         epochTimestamp: dateObj.getTime(),
-      ...(activity === "BA-Checks" && { baType: type }),
-      ...(activity === "Chainsaw-Checks" && { chainsawType: type }),
       ...(activity === "Other-Non-operational" && { otherType })
         } 
         const response = await fetch(`${apiurl}/api/attendance/submit`, {
@@ -102,7 +78,6 @@ export default function OperationalPage() {
           throw new Error("Insert Failed")
         }
         finalresponse = response
-      };
       const result = await finalresponse.json();
 
       const message = encodeURIComponent("Attendance logged successfully!");
@@ -133,59 +108,13 @@ export default function OperationalPage() {
             </button>
           ))}
         </div>
-          {selectedActivity === "BA-Checks" && (
-          <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
-          style={{
-              fontSize: "1rem",
-              padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
-              width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
-            }}>
-            <label className="form-label fw-bold d-block">Select BA Type:</label>
-            <select
-              className="form-select w-50 mx-auto"
-              value={baType}
-              onChange={(e) => setBaType(e.target.value)}
-            >
-              <option value="">Select Option</option>
-              <option value="Cat 1">Cat 1</option>
-              <option value="Pumper">Pumper</option>
-              <option value="All Vehicles">All Vehicles</option>
-            </select>
-          </div>
-        )}
-        {selectedActivity === "Chainsaw-Checks" && (
-          <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
-          style={{
-              fontSize: "1rem",
-              padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
-              width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
-            }}>
-            <label className="form-label fw-bold d-block">Select Chainsaw Type:</label>
-            <select
-              className="form-select w-50 mx-auto"
-              value={chainsawType}
-              onChange={(e) => setChainsawType(e.target.value)}
-            >
-              <option value="">Select Option</option>
-              <option value="Cat 1">Cat 1</option>
-              <option value="Pumper">Pumper</option>
-              <option value="Cat 9">Cat 9</option>
-              <option value="All Vehicles">All Vehicles</option>
-            </select>
-          </div>
-        )}
         {selectedActivity === "Other-Non-operational" && (
           <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
           style={{
               fontSize: "1rem",
               padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
-              width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
+              maxWidth: "400px", 
+              marginBottom: "1rem"
             }}>
             <label className="form-label fw-bold d-block">Other Non-Operational Activity:</label>
             <input placeholder="Eg Administration"
@@ -206,9 +135,9 @@ export default function OperationalPage() {
             style={{
               fontSize: "1rem",
               padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
+              maxWidth: "400px",   
               width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
+              marginBottom: "1rem"
             }}>
           <label htmlFor="inputDate" className="form-label">Backdate (optional):</label>
           <input

frontend/src/Pages/Attendance/Op-page.jsx

@@ -10,6 +10,10 @@ const activities = [
   "Deployment",
   "Hazard-Reduction",
   "Pile-Burn",
+  "Training",
+  "Maintenance",
+  "BA-Checks",
+  "Chainsaw-Checks",
   "Other-operational",
 ];
 
@@ -21,6 +25,8 @@ export default function OperationalPage() {
         if (csrfToken) sessionStorage.setItem("csrf", csrfToken);
       }, [csrfToken]);
   const [selectedActivity, setSelectedActivity] = useState(sessionStorage.getItem("activity") || "");
+  const [baType, setBaType] = useState("");
+  const [chainsawType, setChainsawType] = useState("");
   const [date, setDate] = useState("");
   const [deploymentType, setDeploymentType] = useState("");
   const [deploymentLocation, setDeploymentLocation] = useState("");
@@ -53,6 +59,21 @@ export default function OperationalPage() {
     username = username.replace(/\./g, " ");
 
     const activitySelection = 'Operational'
+    let payloads;
+
+    if (activity === "BA-Checks") {
+      payloads = 
+        baType === "All Vehicles"
+          ? ["Cat 1", "Pumper"]
+          : [baType]
+    } else if (activity === "Chainsaw-Checks") {
+        payloads =
+          chainsawType === "All Vehicles"
+            ? ["Cat 1", "Pumper", "Cat 9"]
+            :[chainsawType]
+    } else{
+      payloads = [null]
+    }
 
     const data = {
       name: username,
@@ -64,10 +85,13 @@ export default function OperationalPage() {
       deploymentType,
       deploymentLocation,
     }),
+    ...(activity === "BA-Checks" && { baType }),
+    ...(activity === "Chainsaw-Checks" && { chainsawType }),
     ...(activity === "Other-operational" && { otherType })
   };
 
     try {
+      console.log(data)
       const response = await fetch(`${apiurl}/api/attendance/submit`, {
         method: "POST",
         credentials: 'include',
@@ -120,9 +144,9 @@ export default function OperationalPage() {
             style={{
               fontSize: "1rem",
               padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
+              maxWidth: "400px",
               width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
+              marginBottom: "1rem"
             }}>
           <label className="form-label fw-bold d-block">Deployment Type:</label>
           <select
@@ -147,7 +171,29 @@ export default function OperationalPage() {
           </select>
         </div>
       )}
-        {selectedActivity === "Other-operational" && (
+      {selectedActivity === "BA-Checks" && (
+          <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
+          style={{
+              fontSize: "1rem",
+              padding: "0.25rem 0.75rem",
+              maxWidth: "400px",       // ✅ limit total width
+              width: "100%",
+              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
+            }}>
+            <label className="form-label fw-bold d-block">Select BA Type:</label>
+            <select
+              className="form-select w-50 mx-auto"
+              value={baType}
+              onChange={(e) => setBaType(e.target.value)}
+            >
+              <option value="">Select Option</option>
+              <option value="Cat 1">Cat 1</option>
+              <option value="Pumper">Pumper</option>
+              <option value="All Vehicles">All Vehicles</option>
+            </select>
+          </div>
+        )}
+        {selectedActivity === "Chainsaw-Checks" && (
           <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
           style={{
               fontSize: "1rem",
@@ -156,6 +202,29 @@ export default function OperationalPage() {
               width: "100%",
               marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
             }}>
+            <label className="form-label fw-bold d-block">Select Chainsaw Type:</label>
+            <select
+              className="form-select w-50 mx-auto"
+              value={chainsawType}
+              onChange={(e) => setChainsawType(e.target.value)}
+            >
+              <option value="">Select Option</option>
+              <option value="Cat 1">Cat 1</option>
+              <option value="Pumper">Pumper</option>
+              <option value="Cat 9">Cat 9</option>
+              <option value="All Vehicles">All Vehicles</option>
+            </select>
+          </div>
+        )}
+        {selectedActivity === "Other-operational" && (
+          <div className="text-center border border-2 rounded-3 bg-secondary text-black fw-semibold shadow-sm mx-auto"
+          style={{
+              fontSize: "1rem",
+              padding: "0.25rem 0.75rem",
+              maxWidth: "400px",
+              width: "100%",
+              marginBottom: "1rem"
+            }}>
             <label className="form-label fw-bold d-block">Other Operational Activity:</label>
             <input placeholder="Eg Permits"
                   value={otherType}
@@ -175,9 +244,9 @@ export default function OperationalPage() {
             style={{
               fontSize: "1rem",
               padding: "0.25rem 0.75rem",
-              maxWidth: "400px",       // ✅ limit total width
+              maxWidth: "400px",
               width: "100%",
-              marginBottom: "1rem"           // ✅ ensure it shrinks on smaller screens
+              marginBottom: "1rem"
             }}
         >
           <label htmlFor="inputDate" className="form-label">Backdate (optional):</label>