Browse Source

Merge branch 'main' into matteing-sprint-1

# Conflicts:
#	src/components/ListComponent.css
#	src/components/ListComponent.tsx
#	src/pages/AdviceListPage.tsx
#	src/pages/Home.tsx
#	src/pages/LawListPage.tsx
#	src/types.ts
Sergio Mattei 1 year ago
parent
commit
ed9ba1e37f
2 changed files with 37 additions and 0 deletions
  1. 3
    0
      src/components/DropdownComponent.css
  2. 34
    0
      src/components/DropdownComponent.tsx

+ 3
- 0
src/components/DropdownComponent.css View File

@@ -0,0 +1,3 @@
1
+.accordion-list-container {
2
+    width: 100%;
3
+}

+ 34
- 0
src/components/DropdownComponent.tsx View File

@@ -0,0 +1,34 @@
1
+import {
2
+  IonAccordion,
3
+  IonAccordionGroup,
4
+  IonItem,
5
+  IonLabel,
6
+} from "@ionic/react";
7
+import ListComponent from "../components/ListComponent";
8
+import { Category } from "../types";
9
+import "./DropdownComponent.css";
10
+
11
+const DropdownComponent: React.FC<{
12
+  category: Category[];
13
+}> = (props) => {
14
+  const category = props.category;
15
+  return (
16
+    <IonAccordionGroup>
17
+      {category.map((catItem: Category, index) => {
18
+        return (
19
+          <IonAccordion value={`${index}`}>
20
+            <IonItem slot="header" color="light">
21
+              <IonLabel>{catItem.name}</IonLabel>
22
+            </IonItem>
23
+            <IonItem slot="content">
24
+              <div className="accordion-list-container">
25
+                <ListComponent items={catItem.listItems} />
26
+              </div>
27
+            </IonItem>
28
+          </IonAccordion>
29
+        );
30
+      })}
31
+    </IonAccordionGroup>
32
+  );
33
+};
34
+export default DropdownComponent;