From e5c6cef75164aa7c9385c45690e2bbb0be3ebe64 Mon Sep 17 00:00:00 2001
From: Maximilian Harz <maxharz@gmail.com>
Date: Thu, 6 Mar 2025 18:28:28 +0100
Subject: [PATCH] Add showcase for PopupButton template component

---
 .../TemplatePopupButton.tsx                   | 24 +++++++++++++++++++
 .../templateComponents/Templateify.tsx        | 23 ++++++++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 src/Components/Profile/templateComponents/TemplatePopupButton.tsx
 create mode 100644 src/Components/Profile/templateComponents/Templateify.tsx

diff --git a/src/Components/Profile/templateComponents/TemplatePopupButton.tsx b/src/Components/Profile/templateComponents/TemplatePopupButton.tsx
new file mode 100644
index 00000000..405e57af
--- /dev/null
+++ b/src/Components/Profile/templateComponents/TemplatePopupButton.tsx
@@ -0,0 +1,24 @@
+import { useContext } from 'react'
+
+import { PopupButton } from '#components/Map'
+
+import { Templateify } from './Templateify'
+import ItemContext from './TemplateItemContext'
+
+import type { JSXElementConstructor } from 'react'
+
+type OmitItem<T extends keyof React.JSX.IntrinsicElements | JSXElementConstructor<unknown>> = Omit<
+  React.ComponentProps<T>,
+  'item'
+>
+
+/**
+ * @category Map
+ */
+export const TemplatePopupButton = (props: OmitItem<typeof PopupButton>) => {
+  const item = useContext(ItemContext)
+
+  return <PopupButton {...props} item={item} />
+}
+
+export const TemplatePopupButton2 = Templateify(PopupButton)
diff --git a/src/Components/Profile/templateComponents/Templateify.tsx b/src/Components/Profile/templateComponents/Templateify.tsx
new file mode 100644
index 00000000..ae1532a2
--- /dev/null
+++ b/src/Components/Profile/templateComponents/Templateify.tsx
@@ -0,0 +1,23 @@
+import { useContext } from 'react'
+
+import ItemContext from './TemplateItemContext'
+
+import type { Item } from '#types/Item'
+import type { JSXElementConstructor } from 'react'
+
+type OmitItem<T extends keyof React.JSX.IntrinsicElements | JSXElementConstructor<unknown>> = Omit<
+  React.ComponentProps<T>,
+  'item'
+>
+
+export function Templateify<
+  T extends keyof React.JSX.IntrinsicElements | JSXElementConstructor<unknown>,
+>(Component: React.JSXElementConstructor<React.PropsWithChildren<{ item?: Item }>>) {
+  const TemplateComponent = (props: OmitItem<T>) => {
+    const item = useContext(ItemContext)
+
+    return <Component {...props} item={item} />
+  }
+
+  return TemplateComponent
+}