hot fixes

client/src/assets/styles/components/Inputs.scss

@@ -32,4 +32,8 @@
     line-height: 1rem;
     color: var(--grey-100);
   }
+
+  select {
+    direction: rtl;
+  }
 }

client/src/components/common/InfoSection.jsx

@@ -22,6 +22,10 @@ export default function InfoSection() {
 
     const { data: budget, isFetching: isFetchingBudget } = useGetBudgetQuery();
 
+    if (budget && !isFetchingBudget) console.log(budget);
+    if (absenceRate && !isFetchingAbsence) console.log(absenceRate);
+    if (scouts && !isFetchingScoutsCount) console.log(scouts);
+
     return (
       <>
         <InfoBox
@@ -42,7 +46,7 @@ export default function InfoSection() {
               ? "جاري التحميل"
               : !absenceRate
               ? "لا يوجد بيانات"
-              : absenceRate?.body?.absenceRate + "%"
+              : absenceRate?.body * 100 + "%"
           }
           color="dark"
         />

client/src/components/common/TermInfoSection.jsx

@@ -10,14 +10,21 @@ import InfoBox from "./InfoBox";
 export default function TermInfoSection() {
   const { data: termInfo, isFetching: isFetchingTerm } = useGetCurTermQuery();
   const { data: curWeek, isFetching: isFetchingWeek } = useGetCurWeekQuery();
-  const { data: weeksLeft, isFetching: isFetchingWeeksLeft } =
-    useGetRemainingWeeksQuery();
+  const {
+    data: weeksLeft,
+    isFetching: isFetchingWeeksLeft,
+    isLoading,
+  } = useGetRemainingWeeksQuery();
 
-  console.log({
-    termInfo,
-    curWeek,
-    weeksLeft,
-  });
+  if (
+    termInfo &&
+    !isFetchingTerm &&
+    curWeek &&
+    !isFetchingWeek &&
+    weeksLeft &&
+    !isFetchingWeeksLeft
+  )
+    console.log({ termInfo, curWeek, weeksLeft });
 
   return (
     <div
@@ -32,7 +39,7 @@ export default function TermInfoSection() {
           color="colorful"
           title="اسم الفترة"
           value={
-            isFetchingTerm
+            isFetchingTerm || isLoading
               ? "جاري التحميل"
               : !termInfo
               ? "لا يوجد بيانات"
@@ -43,14 +50,18 @@ export default function TermInfoSection() {
           color="dark"
           title="الاسبوع الحالي"
           value={
-            isFetchingWeek ? "جاري التحميل" : !curWeek ? "0" : curWeek?.body
+            isFetchingWeek || isLoading
+              ? "جاري التحميل"
+              : !curWeek
+              ? "0"
+              : curWeek?.body?.weekNumber
           }
         />
         <InfoBox
           color="dark"
           title="الاسابيع الباقية"
           value={
-            isFetchingWeeksLeft
+            isFetchingWeeksLeft || isLoading
               ? "جاري التحميل"
               : !weeksLeft
               ? "0"
@@ -67,7 +78,9 @@ export default function TermInfoSection() {
         }}
         className="row"
       >
-        <Button disabled className="Button--danger">إلغاء الاسبوع</Button>
+        <Button disabled className="Button--danger">
+          إلغاء الاسبوع
+        </Button>
         <Button linkTo="/edit-term" className="Button--dark">
           تعديل الفترة
         </Button>

client/src/components/insert-sector/InsertSector.jsx

@@ -79,15 +79,18 @@ export default function InsertSector() {
             required
           />
           <CustomSelect
-            data={unitCaptains}
+            data={unitCaptains.map((captain) => ({
+              ...captain,
+              text: captain?.firstName + " " + captain?.middleName + " " + captain?.lastName, 
+            }))}
             label="قائد القطاع"
             name="unitSectorLeader"
             selectedValue={unitSectorLeader}
             onChange={(e) => {
               setUnitSectorLeader(e.target.value);
             }}
             required
-            displayMember="firstName"
+            displayMember="text"
             valueMember="captainId"
           />
           {isFetching && (

client/src/components/landingpage/LandingPage.scss

@@ -1,5 +1,6 @@
 .landing_page {
   --icon-size: 32px;
+  direction: rtl;
 
   .hero {
     padding-block: 60px;
@@ -24,7 +25,7 @@
       justify-content: center;
       gap: 20px;
 
-      >* {
+      > * {
         min-width: 70%;
       }
     }
@@ -59,7 +60,7 @@
       .icon {
         color: var(--primary-100);
 
-        >* {
+        > * {
           width: var(--icon-size);
           height: var(--icon-size);
         }
@@ -77,4 +78,4 @@
   display: flex;
   justify-content: center;
   align-items: center;
-}
+}

client/src/redux/slices/apiSlice.js

@@ -10,6 +10,20 @@ const baseQuery = fetchBaseQuery({ baseUrl });
 
 export const apiSlice = createApi({
   baseQuery,
-  tagTypes: ["Scouts"],
+  tagTypes: [
+    "Scouts",
+    "Terms",
+    "Weeks",
+    "Captains",
+    "Units",
+    "finance",
+    "absence",
+    "attendance",
+    "events",
+    "reports",
+    "users",
+    "auth",
+    "sector",
+  ],
   endpoints: () => ({}),
 });

client/src/redux/slices/captainsApiSlice.js

@@ -9,12 +9,14 @@ export const captainsApi = apiSlice.injectEndpoints({
         url: `${CAPTAINS_URL}/`,
         method: "GET",
       }),
+      providesTags: ["Captains"],
     }),
     GetUnitCaptains: builder.query({
       query: () => ({
         url: `${CAPTAINS_URL}/`,
         method: "GET",
       }),
+      providesTags: ["Captains"],
     }),
   }),
 });

client/src/redux/slices/financeApiSlice.js

@@ -9,6 +9,7 @@ export const financeApi = apiSlice.injectEndpoints({
         url: `${FINANCE_URL}`,
         method: "GET",
       }),
+      providesTags: ["finance"],
     }),
   }),
 });

client/src/redux/slices/scoutApiSlice.js

@@ -9,6 +9,7 @@ export const scoutsApi = apiSlice.injectEndpoints({
         url: `${SCOUT_URL}/`,
         method: "GET",
       }),
+      providesTags: ["Scouts"]
     }),
   }),
 });

client/src/redux/slices/sectorApiSlice.js

@@ -10,6 +10,7 @@ export const captainsApi = apiSlice.injectEndpoints({
         method: "POST",
         body: sector,
       }),
+      invalidatesTags: ["Sector", "Captains"],
     }),
     UpdateSectorUnitCaptain: builder.mutation({
       query: (sector) => ({
@@ -21,6 +22,7 @@ export const captainsApi = apiSlice.injectEndpoints({
           suffixName: sector.suffixName,
         },
       }),
+      invalidatesTags: ["Sector", "Captains"],
     }),
   }),
 });

client/src/redux/slices/statsApiSlice.js

@@ -9,6 +9,7 @@ export const statsApi = apiSlice.injectEndpoints({
         url: `${STATS_URL}/scouts`,
         method: "GET",
       }),
+      providesTags: ["Stats", "absence"],
     }),
   }),
 });

client/src/redux/slices/termApiSlice.js

@@ -9,32 +9,37 @@ export const termApi = apiSlice.injectEndpoints({
         url: `${TERM_URL}/`,
         method: "GET",
       }),
+      providesTags: ["Term"],
     }),
     GetCurWeek: builder.query({
       query: () => ({
         url: `${TERM_URL}/week`,
         method: "GET",
       }),
+      providesTags: ["Weeks"],
     }),
     GetRemainingWeeks: builder.query({
       query: () => ({
         url: `${TERM_URL}/remaining`,
         method: "GET",
       }),
+      providesTags: ["Weeks"],
     }),
     InsertTerm: builder.mutation({
       query: (term) => ({
         url: `${TERM_URL}/`,
         method: "POST",
         body: term,
       }),
+      invalidatesTags: ["Term", "Weeks"],
     }),
     UpdateTerm: builder.mutation({
       query: (term) => ({
         url: `${TERM_URL}/`,
         method: "PATCH",
         body: term,
       }),
+      invalidatesTags: ["Term", "Weeks"],
     }),
   }),
 });

client/src/redux/slices/usersApiSlice.js

@@ -10,6 +10,7 @@ export const usersApi = apiSlice.injectEndpoints({
         method: "POST",
         body: credentials,
       }),
+      invalidatesTags: ["auth"],
     }),
     logout: builder.mutation({
       query: () => ({
@@ -23,6 +24,7 @@ export const usersApi = apiSlice.injectEndpoints({
         method: "POST",
         body: data,
       }),
+      invalidatesTags: ["Captains", "auth"],
     }),
   }),
 });