inital commitHEADmaster

1 files changed, 155 insertions, 0 deletions

diff --git a/src/app/page.tsx b/src/app/page.tsx
new file mode 100644
index 0000000..aed6b8d
--- /dev/null
+++ b/src/app/page.tsx
@@ -0,0 +1,155 @@
+"use client";
+import VCardExport from "@/components/VCardExport";
+import VCardForm from "@/components/VCardForm";
+import { useState } from "react";
+import { SelectionItem } from "@/lib/definitions";
+
+export default function Home() {
+  // Declare and initialize selection array
+  const [section, setSection] = useState("form");
+  const [selection, setSelection] = useState<SelectionItem[]>([
+    {
+      field: "Vorname",
+      value: "",
+      placeholder: "Max",
+      required: true,
+    },
+    {
+      field: "Nachname",
+      value: "",
+      placeholder: "Mustermann",
+      required: true,
+    },
+    {
+      field: "Spitzname",
+      value: "",
+      placeholder: "Maxi",
+      required: false,
+    },
+    {
+      field: "Email",
+      value: "",
+      placeholder: "max@example.com",
+      required: false,
+    },
+    {
+      field: "Telefonnummer (Zuhause)",
+      value: "",
+      placeholder: "+49 123 456789",
+      required: false,
+    },
+    {
+      field: "Telefonnummer (Mobile)",
+      value: "",
+      placeholder: "+49 123 456789",
+      required: false,
+    },
+    {
+      field: "Telefonnummer (Arbeit)",
+      value: "",
+      placeholder: "+49 123 456789",
+      required: false,
+    },
+    {
+      field: "Land",
+      value: "",
+      placeholder: "Deutschland",
+      required: false,
+    },
+    {
+      field: "Ort",
+      value: "",
+      placeholder: "Musterstadt",
+      required: false,
+    },
+    {
+      field: "Straße",
+      value: "",
+      placeholder: "Musterstraße 1",
+      required: false,
+    },
+    {
+      field: "Postleitzahl",
+      value: "",
+      placeholder: "12345",
+      required: false,
+    },
+    {
+      field: "Geburtstag",
+      value: "",
+      placeholder: "1990-01-01 (jahr-monat-tag)",
+      required: false,
+    },
+    {
+      field: "Firma",
+      value: "",
+      placeholder: "Beispiel GmbH",
+      required: false,
+    },
+    {
+      field: "Abteilung",
+      value: "",
+      placeholder: "Entwicklung",
+      required: false,
+    },
+    {
+      field: "Berufsbezeichnung",
+      value: "",
+      placeholder: "Softwareentwickler",
+      required: false,
+    },
+    {
+      field: "Rolle im Unternehmen",
+      value: "",
+      placeholder: "Projektleiter",
+      required: false,
+    },
+    {
+      field: "Homepage/Persönliche Webseite",
+      value: "",
+      placeholder: "https://example.com",
+      required: false,
+    },
+    {
+      field: "Notizen",
+      value: "",
+      placeholder: "Zusätzliche Informationen...",
+      required: false,
+    },
+  ]);
+  const [vcardData, setVcardData] = useState<string>("");
+
+  // Setting value for field when value changes
+  const handleValueChange = (field: string, value: string) => {
+    setSelection((prev) =>
+      prev.map((item) => (item.field === field ? { ...item, value } : item)),
+    );
+  };
+
+  const handleSectionChange = (section: string) => {
+    setSection(section);
+  };
+
+  return (
+    <div className="flex flex-col items-center mt-5 min-h-screen">
+      <h1 className="text-2xl font-bold mb-8">Leo&apos;s VCard Generator</h1>
+      {/* Show Component based on section */}
+      <div className="flex justify-center gap-8 w-full">
+        {section == "form" && (
+          <VCardForm
+            selection={selection}
+            onValueChange={handleValueChange}
+            sectionChange={handleSectionChange}
+            onGenerate={(data: any) => setVcardData(data)}
+          />
+        )}
+        {section == "export" && (
+          <VCardExport
+            sectionChange={handleSectionChange}
+            vcardText={vcardData}
+          />
+        )}
+      </div>
+    </div>
+  );
+}