init

src/actions/add-to-cart.tsx

@@ -0,0 +1,26 @@
+"use server"
+
+const addToCart = async (barcode: number) => {
+	const request = await fetch(`https://development.vonhelmersen.online/api/stock/products/by-barcode/${barcode}`, {
+		method: 'GET',
+	headers: {
+		'Content-Type': 'application/json',
+		'GROCY-API-KEY': "VCPlNborGO2t8rs08cvqodalf3AjecRwgexWzkIk221mtshLoM"
+
+	}});
+	const data = await request.json();
+	const prod_id = data.product.id;
+	console.log("Product ID:", prod_id);
+
+	const request2 = await fetch(`https://development.vonhelmersen.online/api/userfields/products/${prod_id}`, {
+		method: 'GET',
+	headers: {
+		'Content-Type': 'application/json',
+		'GROCY-API-KEY': "VCPlNborGO2t8rs08cvqodalf3AjecRwgexWzkIk221mtshLoM"
+	}
+	});
+	const userfields = await request2.json();
+	console.log(`Price of product ${data.product.name} is ${userfields.kuelschrankpreis} EUR`);
+	return {name: data.product.name, price: userfields.kuelschrankpreis};
+}
+export default addToCart;

src/actions/checkout.tsx

@@ -0,0 +1,22 @@
+"use server"
+
+const API_KEY = "sup_sk_t6Jf0FwYUAkbjxzvbs6e3BkIePxm0OR3m"
+
+import SumUp from "@sumup/sdk";
+
+const client = new SumUp({
+  apiKey: API_KEY,
+});
+
+
+const checkout = async (total: number) => {
+	const merchantCode = (await client.merchant.getMerchantProfile()).merchant_code || "";
+	const readerId = (await client.readers.list(merchantCode)).items[0].id || "";
+	
+	const respomse = await client.readers.createCheckout(merchantCode, readerId, {total_amount: {value: total * 100, currency: "EUR", minor_unit: 2}});
+	await new Promise(resolve => setTimeout(resolve, 10000));
+	const checkout = await client.transactions.get(merchantCode, {client_transaction_id: respomse.data?.client_transaction_id || ""});
+	console.log("Checkout status:", checkout);
+}
+
+export default checkout;

src/actions/getReaderList.tsx

@@ -0,0 +1,21 @@
+"use server"
+
+const API_KEY = "sup_sk_t6Jf0FwYUAkbjxzvbs6e3BkIePxm0OR3m"
+
+import SumUp from "@sumup/sdk";
+
+const client = new SumUp({
+  apiKey: API_KEY,
+});
+
+const getReaderList = async () => {
+	const merchantCode = (await client.merchant.getMerchantProfile()).merchant_code || "";
+	const readers = await client.readers.list(merchantCode);
+	const list = [];
+	for (const reader of readers.items) {
+		list.push(reader.name);
+	}
+
+	return list;	
+}
+export default getReaderList;

src/actions/registerReader.tsx

@@ -0,0 +1,17 @@
+"use server"
+
+const API_KEY = "sup_sk_t6Jf0FwYUAkbjxzvbs6e3BkIePxm0OR3m"
+
+import SumUp from "@sumup/sdk";
+import getReaderList from "./getReaderList";
+
+const client = new SumUp({
+  apiKey: API_KEY,
+});
+
+const registerReader = async (registerName: string, paringCode: string) => {
+	const merchantCode = (await client.merchant.getMerchantProfile()).merchant_code || "";
+	const response = await client.readers.create(merchantCode, {pairing_code: paringCode, name: registerName});
+	return await getReaderList();
+}
+export default registerReader;

src/app/globals.css

@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --font-sans: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+
+body {
+  background: var(--background);
+  color: var(--foreground);
+  font-family: Arial, Helvetica, sans-serif;
+}

src/app/layout.tsx

@@ -0,0 +1,34 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import "./globals.css";
+
+const geistSans = Geist({
+  variable: "--font-geist-sans",
+  subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+  title: "Create Next App",
+  description: "Generated by create next app",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <body
+        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+      >
+        {children}
+      </body>
+    </html>
+  );
+}

src/app/page.tsx

@@ -0,0 +1,41 @@
+"use client"
+import addToCart from "@/actions/add-to-cart";
+import checkout from "@/actions/checkout";
+import { useState } from "react";
+
+export default function Home() {
+	const [ cart, setCart ] = useState<{name: string, price: number}[]>([]);
+	const handleSubmit =  async (formData: FormData) => {
+		const barcode = formData.get("barcode")? Number(formData.get("barcode")) : 0;
+		addToCart(barcode).then((item) => {
+			const newCart = [...cart, item];
+			setCart(newCart);
+		});
+	}
+	const handleCheckout = (formData: FormData) => {
+		var total: number = 0;
+		cart.forEach((item) => {
+			total += (Number(item.price));
+		});
+		checkout(total);
+		setCart([]);
+	}
+	return (
+		<>
+		<h1>Barcode:</h1>
+		<form action={handleSubmit}>
+			<input type="number" name="barcode" placeholder="Enter barcode" />
+			<button type="submit">Submit</button>
+		</form>
+		<h2>Cart:</h2>
+		<ul>
+			{cart.map((item, index) => (
+				<li key={index}>{item.name}: {item.price} EUR</li>
+			))}
+		</ul>
+		<form action={handleCheckout}>
+			<button type="submit">Checkout</button>
+		</form>
+		</>
+	)
+}

src/app/reader/page.tsx

@@ -0,0 +1,35 @@
+"use client";
+
+import getReaderList from "@/actions/getReaderList";
+import registerReader from "@/actions/registerReader";
+import { useState } from "react";
+
+const Page = () => {
+	const [ readers, setReaders ] = useState<string[]>();
+	const handleRegisterReader = async (formData: FormData) => {
+		const readername = formData.get("readername")?.toString() || "";
+		const pairingcode = formData.get("pairingcode")?.toString() || "";
+		registerReader(readername, pairingcode).then((readerList) => {
+			setReaders(readerList);
+		});
+	}
+	return (
+		<div>
+			<h1>Register Reader</h1>
+			<form action={handleRegisterReader}>
+				<input type="Reader Name" name="readername" placeholder="Enter reader name" />
+				<input type="text" name="pairingcode" placeholder="Enter pairing code" />
+				<button type="submit">Register</button>
+			</form>
+			<h2>Registered Readers:</h2>
+			<ul>
+				{readers ? readers.map((reader, index) => (
+					<li key={index}>{reader}</li>
+				)) : "No readers registered" }
+			</ul>
+		</div>
+	)
+
+}
+
+export default Page;

src/components/cart.tsx

@@ -0,0 +1,11 @@
+"use client";
+import { useState } from "react";
+
+const Cart = () => {
+	const [ cart, setCart ] = useState<{name: string, price: number}[]>([]);
+	return (
+		<div>
+		</div>
+	)
+}
+export default Cart;