formated project with prettier
This commit is contained in:
PxlLoewe
@@ -1,31 +1,35 @@
|
||||
"use client";
|
||||
|
||||
export const ChangeRufgruppe = () => {
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="dropdown flex items-center gap-1">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
|
||||
/>
|
||||
</svg>
|
||||
<div className="badge badge-soft badge-success">1</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li><a>Rufgruppe 1</a></li>
|
||||
<li><a>Rufgruppe 2</a></li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="dropdown flex items-center gap-1">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"
|
||||
/>
|
||||
</svg>
|
||||
<div className="badge badge-soft badge-success">1</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li>
|
||||
<a>Rufgruppe 1</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Rufgruppe 2</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
'use client';
|
||||
import { useEffect, useRef } from 'react';
|
||||
"use client";
|
||||
import { useEffect, useRef } from "react";
|
||||
|
||||
import L from 'leaflet';
|
||||
import 'leaflet/dist/leaflet.css';
|
||||
import L from "leaflet";
|
||||
import "leaflet/dist/leaflet.css";
|
||||
|
||||
export default () => {
|
||||
const mapRef = useRef<HTMLDivElement>(null);
|
||||
const mapRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!mapRef.current) return;
|
||||
useEffect(() => {
|
||||
if (!mapRef.current) return;
|
||||
|
||||
// Initialisiere die Leaflet-Karte
|
||||
const map = L.map(mapRef.current).setView([51.1657, 10.4515], 6); // Deutschland
|
||||
// Initialisiere die Leaflet-Karte
|
||||
const map = L.map(mapRef.current).setView([51.1657, 10.4515], 6); // Deutschland
|
||||
|
||||
// OpenStreetMap Tile Layer hinzufügen
|
||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
attribution:
|
||||
'© <a href="https://www.openstreetmap.org/copyright">OSM</a> contributors',
|
||||
}).addTo(map);
|
||||
// OpenStreetMap Tile Layer hinzufügen
|
||||
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
||||
attribution:
|
||||
'© <a href="https://www.openstreetmap.org/copyright">OSM</a> contributors',
|
||||
}).addTo(map);
|
||||
|
||||
return () => {
|
||||
map.remove(); // Karte beim Unmounten bereinigen
|
||||
};
|
||||
}, []);
|
||||
return () => {
|
||||
map.remove(); // Karte beim Unmounten bereinigen
|
||||
};
|
||||
}, []);
|
||||
|
||||
return <div ref={mapRef} className="w-full h-full rounded-lg shadow-lg" />;
|
||||
return <div ref={mapRef} className="w-full h-full rounded-lg shadow-lg" />;
|
||||
};
|
||||
|
||||
@@ -1,73 +1,73 @@
|
||||
'use client';
|
||||
import { ToggleTalkButton } from '../_components/ToggleTalkButton';
|
||||
import { ChangeRufgruppe } from '../_components/ChangeRufgruppe';
|
||||
import { Notifications } from '../_components/Notifications';
|
||||
import Link from 'next/link';
|
||||
"use client";
|
||||
import { ToggleTalkButton } from "../_components/ToggleTalkButton";
|
||||
import { ChangeRufgruppe } from "../_components/ChangeRufgruppe";
|
||||
import { Notifications } from "../_components/Notifications";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function Navbar() {
|
||||
return (
|
||||
<div className="navbar bg-base-100 shadow-sm">
|
||||
<div className="flex-1">
|
||||
<a className="btn btn-ghost text-xl">VAR Leitstelle V2</a>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<ul className="menu menu-horizontal bg-base-200 rounded-box">
|
||||
<li>
|
||||
<ToggleTalkButton />
|
||||
</li>
|
||||
<li>
|
||||
<ChangeRufgruppe />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Notifications />
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<label className="swap swap-rotate">
|
||||
{/* this hidden checkbox controls the state */}
|
||||
<input type="checkbox" className="theme-controller" value="dark" />
|
||||
return (
|
||||
<div className="navbar bg-base-100 shadow-sm">
|
||||
<div className="flex-1">
|
||||
<a className="btn btn-ghost text-xl">VAR Leitstelle V2</a>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<ul className="menu menu-horizontal bg-base-200 rounded-box">
|
||||
<li>
|
||||
<ToggleTalkButton />
|
||||
</li>
|
||||
<li>
|
||||
<ChangeRufgruppe />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<Notifications />
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<label className="swap swap-rotate">
|
||||
{/* this hidden checkbox controls the state */}
|
||||
<input type="checkbox" className="theme-controller" value="dark" />
|
||||
|
||||
{/* sun icon */}
|
||||
<svg
|
||||
className="swap-off h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" />
|
||||
</svg>
|
||||
{/* sun icon */}
|
||||
<svg
|
||||
className="swap-off h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z" />
|
||||
</svg>
|
||||
|
||||
{/* moon icon */}
|
||||
<svg
|
||||
className="swap-on h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" />
|
||||
</svg>
|
||||
</label>
|
||||
<div className="dropdown dropdown-end">
|
||||
<div tabIndex={0} role="button" className="btn btn-ghost">
|
||||
...
|
||||
</div>
|
||||
<ul
|
||||
tabIndex={0}
|
||||
className="menu menu-sm dropdown-content bg-base-100 box z-1 mt-3 w-52 p-2 shadow"
|
||||
>
|
||||
<li>
|
||||
<a className="justify-between">Profil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Einstellungen</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href={'/logout'}>
|
||||
<p>Logout</p>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
{/* moon icon */}
|
||||
<svg
|
||||
className="swap-on h-10 w-10 fill-current"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z" />
|
||||
</svg>
|
||||
</label>
|
||||
<div className="dropdown dropdown-end">
|
||||
<div tabIndex={0} role="button" className="btn btn-ghost">
|
||||
...
|
||||
</div>
|
||||
<ul
|
||||
tabIndex={0}
|
||||
className="menu menu-sm dropdown-content bg-base-100 box z-1 mt-3 w-52 p-2 shadow"
|
||||
>
|
||||
<li>
|
||||
<a className="justify-between">Profil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a>Einstellungen</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href={"/logout"}>
|
||||
<p>Logout</p>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,28 +1,42 @@
|
||||
"use client";
|
||||
"use client";
|
||||
|
||||
export const Notifications = () => {
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="btn btn-ghost dropdown flex items-center gap-1">
|
||||
<div className="badge badge-sm badge-secondary">+99</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li><a>Testbenachrichtigung 1</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 2</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 3</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 4</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 5</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 6</a></li>
|
||||
<li className="divider"></li>
|
||||
<li><a>Testbenachrichtigung 7</a></li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<details className="dropdown">
|
||||
<summary className="btn btn-ghost dropdown flex items-center gap-1">
|
||||
<div className="badge badge-sm badge-secondary">+99</div>
|
||||
</summary>
|
||||
<ul className="menu dropdown-content bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm">
|
||||
<li>
|
||||
<a>Testbenachrichtigung 1</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 2</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 3</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 4</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 5</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 6</a>
|
||||
</li>
|
||||
<li className="divider"></li>
|
||||
<li>
|
||||
<a>Testbenachrichtigung 7</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,32 +1,32 @@
|
||||
'use client';
|
||||
import { useTalkStore } from '../../_store/useTalkStore';
|
||||
"use client";
|
||||
import { useTalkStore } from "../../_store/useTalkStore";
|
||||
|
||||
export const ToggleTalkButton = () => {
|
||||
const { isTalking, toggleTalking } = useTalkStore();
|
||||
const { isTalking, toggleTalking } = useTalkStore();
|
||||
|
||||
return (
|
||||
<button
|
||||
onClick={toggleTalking}
|
||||
className={`${
|
||||
isTalking
|
||||
? 'bg-red-500 hover:bg-red-600'
|
||||
: 'bg-transparent hover:bg-neutral-300'
|
||||
}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M12 18.75a6 6 0 0 0 6-6v-1.5m-6 7.5a6 6 0 0 1-6-6v-1.5m6 7.5v3.75m-3.75 0h7.5M12 15.75a3 3 0 0 1-3-3V4.5a3 3 0 1 1 6 0v8.25a3 3 0 0 1-3 3Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
);
|
||||
return (
|
||||
<button
|
||||
onClick={toggleTalking}
|
||||
className={`${
|
||||
isTalking
|
||||
? "bg-red-500 hover:bg-red-600"
|
||||
: "bg-transparent hover:bg-neutral-300"
|
||||
}`}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="h-5 w-5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth="2"
|
||||
d="M12 18.75a6 6 0 0 0 6-6v-1.5m-6 7.5a6 6 0 0 1-6-6v-1.5m6 7.5v3.75m-3.75 0h7.5M12 15.75a3 3 0 0 1-3-3V4.5a3 3 0 1 1 6 0v8.25a3 3 0 0 1-3 3Z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,27 +1,27 @@
|
||||
import type { Metadata } from 'next';
|
||||
import Navbar from './_components/Navbar';
|
||||
import { useSession } from 'next-auth/react';
|
||||
import { redirect } from 'next/navigation';
|
||||
import { getServerSession } from '../api/auth/[...nextauth]/auth';
|
||||
import type { Metadata } from "next";
|
||||
import Navbar from "./_components/Navbar";
|
||||
import { useSession } from "next-auth/react";
|
||||
import { redirect } from "next/navigation";
|
||||
import { getServerSession } from "../api/auth/[...nextauth]/auth";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'VAR Leitstelle v2',
|
||||
description: 'Die neue VAR Leitstelle.',
|
||||
title: "VAR Leitstelle v2",
|
||||
description: "Die neue VAR Leitstelle.",
|
||||
};
|
||||
|
||||
export default async function RootLayout({
|
||||
children,
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
const session = await getServerSession();
|
||||
if (!session) {
|
||||
redirect('/login');
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Navbar />
|
||||
{children}
|
||||
</>
|
||||
);
|
||||
const session = await getServerSession();
|
||||
if (!session) {
|
||||
redirect("/login");
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Navbar />
|
||||
{children}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
'use client';
|
||||
import dynamic from 'next/dynamic';
|
||||
const Map = dynamic(() => import('./_components/Map'), { ssr: false });
|
||||
"use client";
|
||||
import dynamic from "next/dynamic";
|
||||
const Map = dynamic(() => import("./_components/Map"), { ssr: false });
|
||||
|
||||
export default () => {
|
||||
return (
|
||||
<div className="relative flex-1">
|
||||
<Map />
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<div className="relative flex-1">
|
||||
<Map />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user