Add FilterAccordion

1 files changed, 24 insertions, 0 deletions

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/FilterAccordion.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/FilterAccordion.tsx
new file mode 100644
index 0000000000..1c5c7f5230
--- /dev/null
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/FilterAccordion.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+
+import { Accordion } from '../lib/components/accordion';
+
+export type FilterAccordionProps = {
+  title?: string;
+  children?: React.ReactNode;
+  defaultOpen?: boolean;
+};
+
+export function FilterAccordion({ title, children, defaultOpen }: FilterAccordionProps) {
+  const [open, setOpen] = React.useState(defaultOpen);
+  return (
+    <Accordion expanded={open} onExpandedChange={setOpen}>
+      <Accordion.Trigger>
+        <Accordion.Header>
+          <Accordion.Title>{title}</Accordion.Title>
+          <Accordion.Icon />
+        </Accordion.Header>
+      </Accordion.Trigger>
+      <Accordion.Content>{children}</Accordion.Content>
+    </Accordion>
+  );
+}