From 820bb4d6108099e90a1b22a20e81a3b9f996a87c Mon Sep 17 00:00:00 2001
From: Ajoy10 <achu.ajoy10@gmail.com>
Date: Sat, 16 Mar 2024 20:50:55 +0530
Subject: [PATCH] Added admin settings

---
 src/commons/Sidebar/index.jsx         |  4 ++
 src/components/CollegeTeams/index.jsx | 21 ++++++--
 src/components/Index/index.jsx        | 18 +++++--
 src/components/Settings/Index.jsx     | 78 +++++++++++++++++++++++++++
 src/pages/index.jsx                   |  4 ++
 src/services/settingsServices.js      | 39 ++++++++++++++
 6 files changed, 154 insertions(+), 10 deletions(-)
 create mode 100644 src/components/Settings/Index.jsx
 create mode 100644 src/services/settingsServices.js

diff --git a/src/commons/Sidebar/index.jsx b/src/commons/Sidebar/index.jsx
index 5809f36..5ef941b 100644
--- a/src/commons/Sidebar/index.jsx
+++ b/src/commons/Sidebar/index.jsx
@@ -132,6 +132,10 @@ const SidebarItems = ({ backupName, backupData }) => {
         <Dropdown.Item as="a">
           <DropItem to="/leaderboard" title="Event Standings" />
         </Dropdown.Item>
+
+        <Dropdown.Item as="a">
+          <DropItem to="/settings" title="Settings" />
+        </Dropdown.Item>
       </Dropdown>
       }
 
diff --git a/src/components/CollegeTeams/index.jsx b/src/components/CollegeTeams/index.jsx
index f2ce80f..4296941 100644
--- a/src/components/CollegeTeams/index.jsx
+++ b/src/components/CollegeTeams/index.jsx
@@ -6,6 +6,7 @@ import { getUser } from "../../services/userServices";
 import LoadContent from "../../commons/LoadContent";
 import { isTeamChangeFreezed } from "../../utils/common";
 import { FiEdit } from "react-icons/fi";
+import { getSetting } from "../../services/settingsServices";
 
 const styles = {
   memberCard: {
@@ -26,11 +27,11 @@ const styles = {
   },
 };
 
-const MemberCard = ({ member, team }) => (
-  <Link to={!isTeamChangeFreezed() && "/teams/members/" + member.id + "/edit"} css={{
+const MemberCard = ({ member, team, teamEditEnabled }) => (
+  <Link to={teamEditEnabled && "/teams/members/" + member.id + "/edit"} css={{
     ...styles.memberCard,
   }}>
-    {!isTeamChangeFreezed() &&<div className="w-100 flex justify-end opacity-60"><FiEdit/></div> }
+    {teamEditEnabled &&<div className="w-100 flex justify-end opacity-60"><FiEdit/></div> }
     <div css={{
       fontSize: "1.3em",
     }}>
@@ -55,7 +56,8 @@ export default class Teams extends React.Component {
     collegeLoading: true,
     events: [],
     teams: {},
-    teamsLoading: true
+    teamsLoading: true,
+    teamEditEnabled: false,
   };
 
   componentWillMount() {
@@ -85,6 +87,15 @@ export default class Teams extends React.Component {
         });
       });
     });
+
+    getSetting("editTeamEnabled").then((data)=>{
+      if(data)
+      {
+        this.setState({teamEditEnabled: data})
+      }else{
+        this.setState({teamEditEnabled: false})
+      }
+    });
   }
 
   render = () => {
@@ -110,7 +121,7 @@ export default class Teams extends React.Component {
                     {
                       this.state.teams[event].map((team) =>
                         team.members.map((member, i) => (
-                          <MemberCard key={i} member={member} team={team} />
+                          <MemberCard key={i} member={member} team={team} teamEditEnabled={this.state.teamEditEnabled} />
                         ))
                       )
                     }
diff --git a/src/components/Index/index.jsx b/src/components/Index/index.jsx
index 365e461..974b9b7 100644
--- a/src/components/Index/index.jsx
+++ b/src/components/Index/index.jsx
@@ -1,6 +1,7 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import utsavLogo from "../../images/loader.gif"
 import Countdown from 'react-countdown';
+import { getSetting } from "../../services/settingsServices";
 
 const cookingEventsOpenDate = new Date("February 27, 2023, 23:59:59");
 const cookingEventsCloseDate = new Date("March 6, 2023, 17:00:00");
@@ -40,12 +41,19 @@ const RegistrationTimer = () => {
 
 }
 
-export default () =>
-  <div css={{ textAlign: "center" }}>
+export default () =>{
+  const [title, setTitle] = useState("UTSAV 2024!")
+  useEffect(() => {
+    getSetting("title").then(data=>setTitle(data || "UTSAV 2024!"));
+  }, [])
+  
+  return (
+    <div css={{ textAlign: "center" }}>
     <h2 className="mucapp">MAHE Utsav Coordinators App</h2>
-    <h1 className="mucapp"> UTSAV 2024!</h1>
+    <h1 className="mucapp">{title}</h1>
     {/* <RegistrationTimer /> */}
     {/* <div className="festival-live-message">The festival is on!</div> */}
     <img className="mucapp" css={{ width: "60%" }} alt="Logo" src={utsavLogo} />
   </div >
-  ;
+  ) 
+};
diff --git a/src/components/Settings/Index.jsx b/src/components/Settings/Index.jsx
new file mode 100644
index 0000000..29d9a02
--- /dev/null
+++ b/src/components/Settings/Index.jsx
@@ -0,0 +1,78 @@
+import React from "react";
+
+import {getSettings, updateSettings} from "../../services/settingsServices";
+import Loader from "../../commons/Loader";
+import { toast } from "../../actions/toastActions";
+
+const styles = {
+  teamCard: {
+    display: "inline-block",
+    marginRight: 20,
+    marginBottom: 20,
+    padding: 20,
+    width: "100%",
+    borderRadius: 3,
+    border: "2px solid rgba(0, 0, 0, .1)",
+    color: "inherit",
+    boxShadow: "0px 5px 20px -4px rgba(0, 0, 0, .1)",
+    transition: "box-shadow .2s ease",
+    ":hover": {
+      color: "inherit",
+      boxShadow: "0px 5px 50px -4px rgba(0, 0, 0, .1)",
+    }
+  },
+};
+
+
+export default class Settings extends React.Component {
+  state = {
+    title: "",
+    enableTeamEdit: false,
+  };
+
+  
+
+  handleSave(){
+    const data = {title: this.state.title, editTeamEnabled: this.state.enableTeamEdit};
+    console.log(data)
+    updateSettings(data).then(data=>{
+      toast("Updated ✔")
+    });
+  }
+
+  componentWillMount() {
+    getSettings().then(settings=>{
+      console.log(settings);
+      if(settings){
+        this.setState({
+          title: settings.title || "",
+          enableTeamEdit: settings.editTeamEnabled || false,
+        })
+      }
+    }).catch((err)=>{
+      console.error(err)
+    })
+  }
+
+  
+
+  render = () => (
+    <div className=" w-[400px] bg-zinc-50 border p-4 rounded-md ">
+      <h2 className="mucapp">Settings</h2>
+      
+      <div className="flex flex-col gap-4 p-6">
+        <div className="input-group gap-1 flex flex-col">
+            <label htmlFor="title" className=" text-md">Title</label>
+            <input className=" border rounded-sm h-10 py-2 px-1 text-base" type="text" id="title" value={this.state.title} onChange={(e)=>this.setState({title: e.target.value})}/>
+        </div>
+
+        <div className="input-group gap-2 flex">
+            <label htmlFor="enable_team_edit" className=" text-md">Enable Team Edit</label>
+            <input className=" border rounded-sm w-[20px]" type="checkbox" id="enable_team_edit" value={this.state.enableTeamEdit} onChange={(e)=>this.setState({enableTeamEdit: e.target.checked})}  checked={this.state.enableTeamEdit}/>
+        </div>
+
+        <button className="mucapp mt-4 w-[200px]" onClick={this.handleSave.bind(this)}>Save</button>
+      </div>
+    </div>
+  );
+};
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 7a9c1df..368ee04 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -68,6 +68,7 @@ import PracticeSlots from "../components/PracticeSlots";
 import PublicPracticeSlots from "../components/PublicPracticeSlots";
 import Notifications from "../components/Notifications";
 import PublicEvents from "../components/PublicEvents";
+import Settings from "../components/Settings/Index";
 
 
 if (typeof (document) != 'undefined')
@@ -155,6 +156,9 @@ export default () =>
       <PrivateRoute path="/practice-slots/public" component={PublicPracticeSlots} type={8} />
       <PrivateRoute path="/notifications" component={Notifications} type={8} />
 
+      <PrivateRoute path="/settings" component={Settings} type={1} />
+
+
 
       {/* <PrivateRoute path="/volunteers/event" component={EventVolunteer} type={1 << 3} /> */}
       {/* <PrivateRoute path="/viewCoreVolunteer" component={ViewCoreVolunteer} type={4} />
diff --git a/src/services/settingsServices.js b/src/services/settingsServices.js
new file mode 100644
index 0000000..88fd92d
--- /dev/null
+++ b/src/services/settingsServices.js
@@ -0,0 +1,39 @@
+import { toast } from "../actions/toastActions";
+import request from "../utils/request";
+
+
+/**
+ * @typedef {"title" | "editTeamEnabled"} SettingValues
+ */
+
+
+/**
+ * 
+ * @param {SettingValues} setting 
+ */
+export const getSetting = async (setting) =>{
+    let response = await request(`/settings/${setting}`);
+    if(response.status == 200){
+        return response.data;
+    }else{
+        console.error("Error in getSetting", response);
+        return null
+    }
+}
+
+export const getSettings = async () => {
+    let response = await request(`/settings`);
+    return response.data;
+}
+
+export const updateSettings = async ({title, editTeamEnabled}) => {
+    const data = {title, editTeamEnabled};
+    let response = await request(`/settings`, 'POST', data);
+
+    if(response?.status == 200){
+        return response.data
+    }else{
+        console.error(response);
+        toast("Failed to update!");
+    }
+}
\ No newline at end of file