Merge branch 'develop' of github.com:atlp-rwanda/atlp-devpulse-fn into ft-minimize-dashboard-menu

Author: Aime-Patrick

.codeclimate.yml

@@ -23,7 +23,7 @@ checks:
   method-lines:
     enabled: true
     config:
-      threshold: 45
+      threshold: 90
   nested-control-flow:
     enabled: true
     config:

src/components/GoogleForm/ApplicationForm.tsx

@@ -11,7 +11,7 @@ const ApplicationForm = () => {
 
   return (
     <div>
-      <div className='flex '>
+      <div className='flex justify-center'>
         <div className='flex px-5 py-2 w-fit'>
           <button
             onClick={() =>
@@ -23,7 +23,7 @@ const ApplicationForm = () => {
           </button>
         </div>
         <div>
-          <Link to={'/view-forms'}>
+          <Link to={'/admin/view-forms'}>
             <button className='flex bg-primary dark:bg-[#56C870] rounded-md py-2 mt-2 px-4 text-white font-medium cursor-pointer'>
               <icons.AiFillBook className='mt-1 mr-1 font-bold' /> View All
               Forms

src/components/GoogleForm/RecentForms.tsx

@@ -132,7 +132,7 @@ const RecentForms = () => {
   return (
     <div>
       <div className='pl-4 md:pl-8'>
-        <Link to={'/create-form'}>
+        <Link to={'/admin/create-form'}>
           <button className='flex bg-primary dark:bg-[#56C870] rounded-md py-2 mt-2 px-4 text-white font-medium cursor-pointer'>
             <icons.AiOutlinePlus className='mt-1 mr-1 font-bold' /> Create New
             Form

src/components/GoogleForm/SaveForm.tsx

@@ -135,7 +135,7 @@ function SaveFormDetails() {
   });
 
   return (
-    <div className='overflow-hidden  py-16 px-6 lg:px-8 lg:py-24'>
+    <div className='overflow-hidden'>
       <div className='relative mx-auto max-w-xl'>
         <div className='text-center'>
           <h2 className='text-3xl font-bold tracking-tight text-primary dark:text-secondary sm:text-4xl'>

src/components/GradingBox.tsx

@@ -79,7 +79,7 @@ function GradingBox(props: any) {
 
     if (exist) {
 
-      const newAssess = assessment.map((element, index) => {
+      const newAssess = assessment?.map((element, index) => {
         if (index === id) {
           return nAssessment;
         } else {
@@ -98,7 +98,7 @@ function GradingBox(props: any) {
 
     if (exist) {
 
-      const newGrade = grade.map((element, index) => {
+      const newGrade = grade?.map((element, index) => {
         if (index === id) {
           if (field === "attribute") {
             const grde = { attribute: value, scale: element?.scale }
@@ -230,7 +230,7 @@ function GradingBox(props: any) {
   return (
     <div>
       <div
-        className={` flex  justify-center mt-20 static left-0`}
+        className={` flex  justify-center static left-0`}
       >
         <div className="bg-white dark:bg-dark-bg w-full lg:w-[50%] xl:w-5/12 rounded-lg p-1 xl:p-4 lg:p-4 pb-8 mb-20">
           <div className="card-title w-full flex  flex-wrap justify-center items-center  ">
@@ -265,7 +265,7 @@ function GradingBox(props: any) {
                       changeAssess(0, e.target.value)
                     }}
                     options={[{ value: "--- Choose assessment---", label: "Choose assessment" },
-                    allAssessments?.data.map((element) => ({
+                    allAssessments?.data?.map((element) => ({
                       value: element.id, label: element.label
                     })
                     )]}
@@ -286,7 +286,7 @@ function GradingBox(props: any) {
               </div>
               {
                 (newAssessment.length > 0) &&
-                newAssessment.map((element, index) => {
+                newAssessment?.map((element, index) => {
                   return (
                     <div className="input mt-4 mb-4 h-9 ">
                       <div className="grouped-input flex items-center h-full w-full rounded-md">
@@ -301,7 +301,7 @@ function GradingBox(props: any) {
                           <option disabled hidden value="">{"---Choose Assessment---"}</option>
                           {
                             allAssessments?.data &&
-                            (allAssessments?.data.map((element) => {
+                            (allAssessments?.data?.map((element) => {
                               return (
                                 <option value={element.id}>{element.title}</option>)
                             })
@@ -368,7 +368,7 @@ function GradingBox(props: any) {
                       <option value="Letter Grades">Letter Grades</option>
                       <option value="Pass/Fail">Pass/Fail</option>
                     </select>
-                    {rateType.map((element) => {
+                    {rateType?.map((element) => {
                       return (element.attribute === "main" &&
                         ((element.type === "Linear Scale" || element.type === "Letter Grades") ?
 
@@ -500,7 +500,7 @@ function GradingBox(props: any) {
               </div>
               {
                 (newAttribute.length > 0) &&
-                newAttribute.map((element, index) => {
+                newAttribute?.map((element, index) => {
                   return (
                     <div className="input mt-4 mb-5 " key={element}>
                       <div className="grouped-input flex h-full w-full space-x-1 rounded-md">
@@ -532,7 +532,7 @@ function GradingBox(props: any) {
                             <option value="Letter Grades">Letter Grades</option>
                             <option value="Pass/Fail">Pass/Fail</option>
                           </select>
-                          {rateType.map((item) => {
+                          {rateType?.map((item) => {
                             return (item.attribute === element &&
                               (
                                 (item.type === "Linear Scale" || item.type === "Letter Grades") ?

src/components/Layout/Admins/AdminLayout.tsx

@@ -0,0 +1,25 @@
+import React from "react";
+import AdminHeader from "../../../components/sidebar/navHeader";
+import Sidebar from "../../../components/sidebar/sidebar";
+import { Outlet } from "react-router";
+const AdminLayout = () => {
+  return (
+    <>
+      <div className="bg-slate-400 h-screen">
+        <div className="bg-red-300 w-full h-[70px]">
+          <AdminHeader />
+        </div>
+        <div className="flex w-full">
+          <div className="w-[16rem] h-full">
+            <Sidebar />
+          </div>
+            <main className="flex w-[100%] justify-center items-center flex-1">
+              <Outlet />
+            </main>
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default AdminLayout;

src/components/ReusableComponents/Select.tsx

@@ -34,9 +34,9 @@ const SelectField: React.FC<SelectFieldProps> = ({
       className={`dark:bg-dark-tertiary dark:text-white shadow appearance-none py-2 px-3 rounded w-full leading-tight focus:outline-none focus:shadow-outline ${className}`}
       onBlur={(e: React.FocusEvent<HTMLSelectElement>) => onBlur?.(e)}
     >
-      {options.map((option) => (
-        <option key={option.value} value={option.value}>
-          {option.label}
+      {options?.map((option) => (
+        <option key={option?.value} value={option?.value}>
+          {option?.label}
         </option>
       ))}
     </select>