From 5258430fe8a63542efa5ddf3511e2b3dc49e31ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fredrik=20M=C3=B8rstad?= <fredrik.morstad@hotmail.com>
Date: Sun, 3 Dec 2023 23:36:34 +0100
Subject: [PATCH] :sparkles: add event view count component

---
 .../event/eventViewCount/EventViewCount.tsx   | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 src/components/molecules/event/eventViewCount/EventViewCount.tsx

diff --git a/src/components/molecules/event/eventViewCount/EventViewCount.tsx b/src/components/molecules/event/eventViewCount/EventViewCount.tsx
new file mode 100644
index 00000000..5e9aab82
--- /dev/null
+++ b/src/components/molecules/event/eventViewCount/EventViewCount.tsx
@@ -0,0 +1,40 @@
+import { Center, Heading, Text } from '@chakra-ui/react';
+import { getPageVisit } from 'api';
+import Icon from 'components/atoms/icons/icon';
+import { useEffect, useState } from 'react';
+
+const EventViewCount: React.FC<{ page: string }> = ({ page }) => {
+  const [views, setViews] = useState<number | undefined>();
+
+  const fetchPageVisist = async () => {
+    const response = await getPageVisit(page);
+    setViews(response.visits);
+  };
+
+  useEffect(() => {
+    fetchPageVisist();
+  }, []);
+
+  return (
+    <Center
+      w="100%"
+      height="20%"
+      borderRadius="lg"
+      border="1px"
+      borderColor="#fffff"
+      textAlign="center"
+      flexDir="column">
+      <Heading size="sm" m=".5rem">
+        Antall besøk
+      </Heading>
+      <Center dir="column" textAlign="center">
+        <Icon size={2} type="eye" />
+        <Text p={0} m={0} ml=".5rem">
+          {views ?? 'N/A'}
+        </Text>
+      </Center>
+    </Center>
+  );
+};
+
+export default EventViewCount;