added make public button

frontend/src/components/AvailabilitiesTable.jsx

@@ -5,7 +5,13 @@ import Row from "react-bootstrap/Row";
 import Col from "react-bootstrap/Col";
 import Button from "react-bootstrap/Button";
 import moment from "moment";
-import { FaPlus, FaInfoCircle, FaTrashAlt, FaEdit } from "react-icons/fa"; // Import FontAwesome Plus Icon
+import {
+  FaPlus,
+  FaInfoCircle,
+  FaTrashAlt,
+  FaEdit,
+  FaGlobe,
+} from "react-icons/fa"; // Import FontAwesome Plus Icon
 
 function AvailabilitiesTable({ authUser }) {
   const [startDate, setStartDate] = useState(
@@ -229,11 +235,38 @@ function AvailabilitiesTable({ authUser }) {
               </Button>
             </>
           )}
+          {interview.status === "draft" && (
+            <Button
+              variant="success"
+              onClick={() => handleMakePublic(interview.availabilityId)}
+            >
+              <FaGlobe /> Make Public
+            </Button>
+          )}
         </div>
       </div>
     );
   };
 
+  const handleMakePublic = (availabilityId) => {
+    console.log(`Making availability with ID ${availabilityId} public`);
+
+    // Update the status of the selected availability
+    const updatedAvailabilities = availabilities.map((availability) =>
+      availability.availabilityId === availabilityId
+        ? {
+            ...availability,
+            interview: {
+              ...availability.interview,
+              status: "published", // Set the status to "published"
+            },
+          }
+        : availability
+    );
+
+    setAvailabilities(updatedAvailabilities); // Update the state
+  };
+
   return (
     <Container fluid>
       <Row>