Merge pull request #11 from dhis2/refactor

refactor: remove unused code

.github/workflows/test-and-release.yml

@@ -21,9 +21,9 @@ jobs:
     #     secrets: inherit
     #     with:
     #         api_version: 42
-    release:
-        needs: [lint-commits, lint, test]
-        uses: dhis2/workflows-platform/.github/workflows/release.yml@v1
-        # Skips forks and dependabot PRs
-        if: '!github.event.push.repository.fork'
-        secrets: inherit
+    # release:
+    #    needs: [lint-commits, lint, test]
+    #    uses: dhis2/workflows-platform/.github/workflows/release.yml@v1
+    #    # Skips forks and dependabot PRs
+    #    if: '!github.event.push.repository.fork'
+    #    secrets: inherit

src/App.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useState } from "react";
 import { exportMetadata } from "./utils/exportMetadata";
 import TrackerProgramSelector from "./components/TrackerProgramSelector";
 import IGConfigForm from "./components/IGConfigForm";
@@ -21,6 +21,7 @@ const MyApp = () => {
       </NoticeBox>
     );
   }
+
   if (loading || !templates) return <CircularLoader />;
 
   const selectedPrograms = programs.filter((program) =>
@@ -46,13 +47,16 @@ const MyApp = () => {
         selectedProgramIds={selectedProgramIds}
         setSelectedProgramIds={setSelectedProgramIds}
       />
+      <div className={classes.downloadButton}>
       <Button
         primary
         onClick={() => exportMetadata(selectedPrograms, templates, igConfig)}
         disabled={selectedPrograms.length === 0 || !igConfig || !templates}
       >
         Download FHIR IG
       </Button>
+      </div>
+
     </div>
   );
 };

src/App.module.css

@@ -7,3 +7,7 @@
     justify-content: center;
     font-size: 1rem;
 }
+
+.downloadButton {
+    margin-top: 20px;
+}

src/components/IGConfigForm.module.css

@@ -1,6 +1,8 @@
 .container {
     padding: 20px;
     background-color: #f5f5f5;
+    max-height: 100%;
+    overflow: auto;
 }
 
 .row {

src/components/TrackerProgramSelector.js

@@ -1,36 +1,32 @@
 import React from "react";
-import { MultiSelect, MultiSelectOption } from "@dhis2/ui";
+import { Transfer } from "@dhis2/ui";
 
 function TrackerProgramSelector({
   programs,
   selectedProgramIds,
   setSelectedProgramIds,
 }) {
-  const handleSelectionChange = ({ selected }) => {
-    if (JSON.stringify(selected) !== JSON.stringify(selectedProgramIds)) {
-      setSelectedProgramIds(selected);
-    }
+  const handleSelectionChange = ({selected}) => {
+      setSelectedProgramIds(Array.isArray(selected) ? selected : []);
   };
 
+  const options = programs.map((program) => ({
+    value: program.id,
+    label: program.displayName,
+  }));
+
   return (
-    <MultiSelect
+    <div>
+      <Transfer
       label="Select Tracker Programs"
       selected={selectedProgramIds}
       onChange={handleSelectionChange}
-      placeholder="Select one or more programs"
-    >
-      {programs.length > 0 ? (
-        programs.map((program) => (
-          <MultiSelectOption
-            key={program.id}
-            value={program.id}
-            label={program.displayName}
-          />
-        ))
-      ) : (
-        <MultiSelectOption disabled label="No programs available" />
-      )}
-    </MultiSelect>
+      options={options}
+      leftHeader="Available Tracker Programs"
+      rightHeader="Selected Tracker Programs"
+      filterable
+      />
+    </div>
   );
 }