feat: Redesigned Funds Screen for Talawa Admin Portal (PalisadoesFoun…

…dation#1790) * feat: Redesigned Funds Screen for Talawa Admin Portal - Redesigned the funds screen as per the figma design. - Except the button to archive/ unarchive funds in the update fund modal I have modified it to switch. - Ensured create and delete funds are working properly. - Modified the update handler to update the fundId for the fund. - Ensured search by fund name also works by adding a new query. - added a new query for fundbyOrganization to retrieve all the funds also to help to sort by name easily. - Ensured the page is responsive for all screens. - Covered all the modified code by tests. Signed-off-by: Akhilender <akhilenderb9@gmail.com> * fix: removed default fallback - Removed fallback as it is used only for testing. Signed-off-by: Akhilender <akhilenderb9@gmail.com> * fix: Fixing failing code coverage * fix: fixing code coverage - Removed redundant loader and increasing code coverage * fix: failing test - MemberDetail previously was not failing and even in local setup it is not failing * fix: Fixed null funds error Signed-off-by: Akhilender <akhilenderb9@gmail.com> --------- Signed-off-by: Akhilender <akhilenderb9@gmail.com>
palisadoes · Mar 27, 2024 · 0f44df2 · 0f44df2
1 parent 42a2052
commit 0f44df2
Show file tree

Hide file tree

Showing 18 changed files with 1,006 additions and 1,255 deletions.
diff --git a/public/locales/en.json b/public/locales/en.json
@@ -39,34 +39,6 @@
     "numeric_value_check": "Atleaset one numeric value",
     "special_char_check": "Atleast one special character"
   },
-  "funds": {
-    "title": "Talawa Funds",
-    "createFund": "Create",
-    "fundName": "Fund Name",
-    "fundId": "Fund ID",
-    "fundOptions": "Opitons",
-    "noFunds": "No Funds Found",
-    "fundDetails": "Fund Details",
-    "taxDeductible": "Tax Deductible",
-    "enterfundName": "Enter Fund Name",
-    "enterfundId": "Enter Fund ID",
-    "default": "Default Fund",
-    "archived": "Archived",
-    "nonArchive": "Non-Archived",
-    "fundCreate": "Create Fund",
-    "fundUpdate": "Update Fund",
-    "fundDelete": "Delete Fund",
-    "no": "No",
-    "yes": "Yes",
-    "archiveFund": "Archive Fund",
-    "archiveFundMsg": "On Archiving this fund will remove it from the fund listing.Thisaction can be undone",
-    "fundCreated": "Fund created successfully",
-    "fundUpdated": "Fund updated successfully",
-    "fundDeleted": "Fund deleted successfully",
-    "fundArchived": "Fund archived successfully",
-    "fundUnarchived": "Fund unarchived successfully",
-    "deleteFundMsg": "Do you want to remove this fund?"
-  },
   "latestEvents": {
     "eventCardTitle": "Upcoming Events",
     "eventCardSeeAll": "See All",
@@ -408,6 +380,41 @@
     "eventUpdated": "Event updated successfully.",
     "talawaApiUnavailable": "Talawa-API service is unavailable. Is it running? Check your network connectivity too."
   },
+  "funds": {
+    "title": "Funds",
+    "createFund": "Create Fund",
+    "fundName": "Fund Name",
+    "fundId": "Fund ID",
+    "fundOptions": "Opitons",
+    "noFunds": "No Funds Found",
+    "fundDetails": "Fund Details",
+    "taxDeductible": "Tax Deductible",
+    "enterfundName": "Enter Fund Name",
+    "enterfundId": "Enter Fund ID",
+    "default": "Default Fund",
+    "archived": "Archived",
+    "nonArchive": "Non-Archived",
+    "fundCreate": "Create Fund",
+    "fundUpdate": "Update Fund",
+    "fundDelete": "Delete Fund",
+    "no": "No",
+    "yes": "Yes",
+    "manageFund": "Manage Fund",
+    "searchFullName": "Search By Name",
+    "filter": "Filter",
+    "noFundsFound": "No Funds Found",
+    "createdBy": "Created By",
+    "createdOn": "Created On",
+    "status": "Status",
+    "archiveFund": "Archive Fund",
+    "archiveFundMsg": "On Archiving this fund will remove it from the fund listing.Thisaction can be undone",
+    "fundCreated": "Fund created successfully",
+    "fundUpdated": "Fund updated successfully",
+    "fundDeleted": "Fund deleted successfully",
+    "fundArchived": "Fund archived successfully",
+    "fundUnarchived": "Fund unarchived successfully",
+    "deleteFundMsg": "Do you want to remove this fund?"
+  },
   "fundCampaign": {
     "title": "Fundraising Campaigns",
     "campaignName": "Campaign Name",

diff --git a/public/locales/fr.json b/public/locales/fr.json
@@ -386,7 +386,7 @@
     "talawaApiUnavailable": "Le service Talawa-API n'est pas disponible. Est-il en cours d'exécution ? Vérifiez également votre connectivité réseau."
   },
   "funds": {
-    "title": "Fonds Talawa",
+    "title": "Fonds",
     "createFund": "Créer un fonds",
     "fundName": "Nom du fonds",
     "fundId": "Identifiant du fonds",
@@ -404,6 +404,13 @@
     "fundDelete": "Supprimer le fonds",
     "no": "Non",
     "yes": "Oui",
+    "manageFund": "Gérer le fonds",
+    "searchFullName": "Rechercher par nom",
+    "filter": "Filtre",
+    "noFundsFound": "Aucun fonds trouvé",
+    "createdBy": "Créé par",
+    "createdOn": "Créé le",
+    "status": "Statut",
     "archiveFund": "Archiver le fonds",
     "archiveFundMsg": "Voulez-vous archiver ce fonds ?",
     "fundCreated": "Fonds créé avec succès",

diff --git a/public/locales/hi.json b/public/locales/hi.json
@@ -387,7 +387,7 @@
     "talawaApiUnavailable": "तलवा-एपीआई सेवा उपलब्ध नहीं है। क्या यह चल रहा है? अपनी नेटवर्क कनेक्टिविटी भी जांचें।"
   },
   "funds": {
-    "title": "तलवा फंड्स",
+    "title": "फंड्स",
     "createFund": "फंड बनाएँ",
     "fundName": "फंड का नाम",
     "fundId": "फंड आईडी",
@@ -405,6 +405,13 @@
     "fundDelete": "फंड हटाएं",
     "no": "नहीं",
     "yes": "हाँ",
+    "manageFund": "कोष प्रबंधित करें",
+    "searchFullName": "नाम से खोजें",
+    "filter": "फ़िल्टर",
+    "noFundsFound": "कोई धनराशि नहीं मिली",
+    "createdBy": "द्वारा बनाया गया",
+    "createdOn": "बनाया गया",
+    "status": "स्थिति",
     "archiveFund": "फंड संग्रहीत करें",
     "archiveFundMsg": "क्या आप इस फंड को संग्रहीत करना चाहते हैं?",
     "fundCreated": "फंड सफलतापूर्वक बनाया गया",

diff --git a/public/locales/sp.json b/public/locales/sp.json
@@ -386,8 +386,8 @@
     "talawaApiUnavailable": "El servicio Talawa-API no está disponible. ¿Está funcionando? Compruebe también la conectividad de su red."
   },
   "funds": {
-    "title": "Fondos de Talawa",
-    "createFund": "Crear",
+    "title": "Fondos",
+    "createFund": "Crear fondo",
     "fundName": "Nombre del Fondo",
     "fundId": "ID del Fondo",
     "fundOptions": "Opciones",
@@ -404,6 +404,13 @@
     "fundDelete": "Eliminar Fondo",
     "no": "No",
     "yes": "Sí",
+    "manageFund": "Administrar fondo",
+    "searchFullName": "Buscar por nombre",
+    "filter": "Filtrar",
+    "noFundsFound": "No se encontraron fondos",
+    "createdBy": "Creado por",
+    "createdOn": "Creado el",
+    "status": "Estado",
     "archiveFund": "Archivar Fondo",
     "archiveFundMsg": "¿Desea archivar este fondo?",
     "fundCreated": "Fondo creado exitosamente",

diff --git a/public/locales/zh.json b/public/locales/zh.json
@@ -89,8 +89,8 @@
     "close": "關"
   },
   "funds": {
-    "title": "塔拉瓦基金",
-    "createFund": "创建",
+    "title": "资金",
+    "createFund": "创建基金",
     "fundName": "基金名称",
     "fundId": "基金ID",
     "fundOptions": "选项",
@@ -107,6 +107,13 @@
     "fundDelete": "删除基金",
     "no": "否",
     "yes": "是",
+    "manageFund": "管理基金",
+    "searchFullName": "按姓名搜索",
+    "filter": "筛选",
+    "noFundsFound": "找不到资金",
+    "createdBy": "创建人",
+    "createdOn": "创建日期",
+    "status": "状态",
     "archiveFund": "归档基金",
     "archiveFundMsg": "您是否要归档此基金？",
     "fundCreated": "基金创建成功",

diff --git a/schema.graphql b/schema.graphql
@@ -1075,6 +1075,7 @@ type Query {
   joinedOrganizations(id: ID): [Organization]
   me: UserData!
   myLanguage: String
+  fundsByOrganization(organizationId: ID!, where: FundWhereInput): [Fund]
   organizations(id: ID, orderBy: OrganizationOrderByInput): [Organization]
   organizationsConnection(
     first: Int
@@ -1356,6 +1357,24 @@ type User {
   updatedAt: DateTime!
 }
 
+type Fund {
+  _id: ID!
+  campaigns: [FundraisingCampaign!]
+  createdAt: DateTime!
+  isArchived: Boolean!
+  isDefault: Boolean!
+  name: String!
+  creator: User
+  organizationId: ID!
+  refrenceNumber: String
+  taxDeductible: Boolean!
+  updatedAt: DateTime!
+}
+
+input FundWhereInput {
+  name_contains: String
+}
+
 input UserAndOrganizationInput {
   organizationId: ID!
   userId: ID!

diff --git a/src/GraphQl/Mutations/FundMutation.ts b/src/GraphQl/Mutations/FundMutation.ts
@@ -40,6 +40,7 @@ export const CREATE_FUND_MUTATION = gql`
  *
  * @param id - The ID of the fund being updated.
  * @param name - The name of the fund.
+ * @param refrenceNumber - The reference number of the fund.
  * @param taxDeductible - Whether the fund is tax deductible.
  * @param isArchived - Whether the fund is archived.
  * @param isDefault - Whether the fund is the default.
@@ -49,6 +50,7 @@ export const UPDATE_FUND_MUTATION = gql`
   mutation UpdateFund(
     $id: ID!
     $name: String
+    $refrenceNumber: String
     $taxDeductible: Boolean
     $isArchived: Boolean
     $isDefault: Boolean
@@ -57,6 +59,7 @@ export const UPDATE_FUND_MUTATION = gql`
       id: $id
       data: {
         name: $name
+        refrenceNumber: $refrenceNumber
         taxDeductible: $taxDeductible
         isArchived: $isArchived
         isDefault: $isDefault

diff --git a/src/GraphQl/Queries/fundQueries.ts b/src/GraphQl/Queries/fundQueries.ts
@@ -1,6 +1,36 @@
 /*eslint-disable*/
 import gql from 'graphql-tag';
 
+/**
+ * GraphQL query to retrieve the list of members for a specific organization.
+ *
+ * @param id - The ID of the organization for which members are being retrieved.
+ * @param filter - The filter to search for a specific member.
+ * @returns The list of members associated with the organization.
+ */
+export const FUND_LIST = gql`
+  query FundsByOrganization($organizationId: ID!, $filter: String) {
+    fundsByOrganization(
+      organizationId: $organizationId
+      where: { name_contains: $filter }
+    ) {
+      _id
+      name
+      refrenceNumber
+      taxDeductible
+      isDefault
+      isArchived
+      createdAt
+      organizationId
+      creator {
+        _id
+        firstName
+        lastName
+      }
+    }
+  }
+`;
+
 export const FUND_CAMPAIGN = gql`
   query GetFundById($id: ID!) {
     getFundById(id: $id) {

diff --git a/src/screens/OrganizationFunds/FundArchiveModal.tsx b/src/screens/OrganizationFunds/FundArchiveModal.tsx
diff --git a/src/screens/OrganizationFunds/FundCreateModal.tsx b/src/screens/OrganizationFunds/FundCreateModal.tsx
@@ -36,7 +36,7 @@ const FundCreateModal: React.FC<InterfaceFundCreateModal> = ({
         show={fundCreateModalIsOpen}
         onHide={hideCreateModal}
       >
-        <Modal.Header>
+        <Modal.Header className={styles.modalHeader}>
           <p className={styles.titlemodal}> {t('fundCreate')}</p>
           <Button
             variant="danger"
@@ -49,7 +49,7 @@ const FundCreateModal: React.FC<InterfaceFundCreateModal> = ({
         <Modal.Body>
           <Form onSubmitCapture={createFundHandler}>
             <Form.Group className="mb-3">
-              <Form.Label>{t('fundName')} </Form.Label>
+              <Form.Label className={styles.label}>{t('fundName')} </Form.Label>
               <Form.Control
                 type="text"
                 placeholder={t('enterfundName')}
@@ -63,7 +63,7 @@ const FundCreateModal: React.FC<InterfaceFundCreateModal> = ({
               />
             </Form.Group>
             <Form.Group className="mb-3">
-              <Form.Label> {t('fundId')} </Form.Label>
+              <Form.Label className={styles.label}> {t('fundId')} </Form.Label>
               <Form.Control
                 type="text"
                 placeholder={t('enterfundId')}
@@ -76,24 +76,26 @@ const FundCreateModal: React.FC<InterfaceFundCreateModal> = ({
                 }
               />
             </Form.Group>
-            <div className="d-flex-col ">
-              <Form.Group className="mb-3">
+            <div className="d-flex mb-3">
+              <Form.Group>
                 <div className="d-flex justify-content-end">
                   <label>{t('taxDeductible')} </label>
                   <Form.Switch
                     type="checkbox"
                     checked={taxDeductible}
+                    data-testid="setTaxDeductibleSwitch"
                     className="ms-2"
                     onChange={() => setTaxDeductible(!taxDeductible)}
                   />
                 </div>
               </Form.Group>
-              <Form.Group className="mb-3">
+              <Form.Group className="ms-3">
                 <div className="d-flex justify-content-end">
                   <label>{t('default')} </label>
                   <Form.Switch
                     type="checkbox"
                     className="ms-2"
+                    data-testid="setDefaultSwitch"
                     checked={isDefault}
                     onChange={() => setIsDefault(!isDefault)}
                   />