Revision of Dashboard File

TheRealToxicDev revidoval tento gist 1704638097. Přejít na revizi

1 file changed, 0 insertions, 0 deletions

gistfile1.txt přejmenováno na UpdatedDash.jsx

Soubor přejmenován beze změn

TheRealToxicDev revidoval tento gist 1704638077. Přejít na revizi

2 files changed, 262 insertions

dashboard.jsx(vytvořil soubor)

		@@ -0,0 +1,143 @@
1	+	import Navbar from '@/components/Navbar'
2	+	import Footer from '@/components/Footer'
3	+
4	+	import Head from 'next/head'
5	+	import Card from '@/components/DashboardCard'
6	+	import PopupForm from '@/components/DashboardCreateEntity'
7	+
8	+	import { useState, useEffect } from 'react'
9	+	import Link from 'next/link'
10	+	import { useRouter } from 'next/router'
11	+
12	+	export const getServerSideProps = (async ctx => {
13	+	const { req } = ctx
14	+	const cookie = req.cookies.user_auth
15	+	if (!cookie) {
16	+	return { redirect: {
17	+	destination: '/login',
18	+	permanent: false
19	+	} }
20	+	} else {
21	+	const cookie_key = req.cookies.user_apiKey
22	+	if (!cookie_key) {
23	+	return { redirect: {
24	+	destination: '/logout',
25	+	permanent: false
26	+	} }
27	+	}
28	+	const response = await fetch(`${process.env.API_URL}/user/find?id=${req.cookies.user_id}`, {
29	+	method: 'GET',
30	+	headers: {
31	+	'authorization': process.env.AUTH,
32	+	},
33	+	})
34	+	const data_json = await response.json()
35	+	if (!response.ok) {
36	+	console.error(response, data_json)
37	+	return { redirect: {
38	+	destination: '/logout',
39	+	permanent: false
40	+	} }
41	+	}
42	+	return { props: { data: data_json } }
43	+	}
44	+	})
45	+
46	+	const Dashboard = ({ data }) => {
47	+	const router = useRouter()
48	+	const [isPopupVisible, setPopupVisibility] = useState(false)
49	+
50	+	const handleCreateButtonClick = () => {
51	+	setPopupVisibility(true)
52	+	}
53	+
54	+	const handleClosePopup = () => {
55	+	setPopupVisibility(false)
56	+	}
57	+
58	+	useEffect(() => {
59	+	const handleMousemove = (e) => {
60	+	const rect = e.currentTarget.getBoundingClientRect();
61	+	const x = e.clientX - rect.left;
62	+	const y = e.clientY - rect.top;
63	+
64	+	e.currentTarget.style.setProperty("--mouse-x", `${x}px`);
65	+	e.currentTarget.style.setProperty("--mouse-y", `${y}px`);
66	+	};
67	+	document.querySelectorAll(".dashboard_entity_card").forEach((card) => {
68	+	card.addEventListener("mousemove", handleMousemove);
69	+	return () => {
70	+	card.removeEventListener("mousemove", handleMousemove);
71	+	};
72	+	});
73	+	}, []);
74	+
75	+
76	+	return (
77	+	<>
78	+	<Head>
79	+	<title>Dashboard - Assistify</title>
80	+	</Head>
81	+	<Navbar user={data}/>
82	+	{Object.keys(data).length !== 0 ? (
83	+	<>
84	+	<main className="dashboard_div">
85	+	<div className="dashboard_headings">
86	+	<h1 className="heading_color">Welcome, {data.name} 👋</h1>
87	+	{/* <button className="cta">
88	+	<span>Create</span>
89	+	<svg viewBox="0 0 13 10" height="10px" width="15px">
90	+	<path d="M1,5 L11,5"></path>
91	+	<polyline points="8 1 12 5 8 9"></polyline>
92	+	</svg>
93	+	</button> */}
94	+	<div className="showcase_buttons">
95	+	<button className="btn" onClick={handleCreateButtonClick}>
96	+	<svg
97	+	height="24"
98	+	width="24"
99	+	fill="#FFFFFF"
100	+	viewBox="0 0 24 24"
101	+	data-name="Layer 1"
102	+	id="Layer_1"
103	+	className="sparkle"
104	+	>
105	+	<path d="M10,21.236,6.755,14.745.264,11.5,6.755,8.255,10,1.764l3.245,6.491L19.736,11.5l-6.491,3.245ZM18,21l1.5,3L21,21l3-1.5L21,18l-1.5-3L18,18l-3,1.5ZM19.333,4.667,20.5,7l1.167-2.333L24,3.5,21.667,2.333,20.5,0,19.333,2.333,17,3.5Z"></path>
106	+	</svg>
107	+
108	+	<span className="text">Create</span>
109	+	</button>
110	+	</div>
111	+	{isPopupVisible && <PopupForm onClose={handleClosePopup} router={router}/>}
112	+	</div>
113	+	<div className="dashboard_entities">
114	+	{data.entities.length !== 0 ? (
115	+	data.entities?.map((entity, index) => {
116	+	return (
117	+	<Link key={index} href={`/entity/${entity.id}`}>
118	+	<Card title={entity.name} key={index} id={entity.id} />
119	+	</Link>
120	+	)
121	+	})
122	+	) : (
123	+	<div
124	+	style={{
125	+	color: '#ddd'
126	+	}}
127	+	>
128	+	You haven't created any entities yet.
129	+	</div>
130	+	)}
131	+	</div>
132	+	</main>
133	+	</>
134	+	) : (
135	+	/* Work on this, show a error */
136	+	Error
137	+	)}
138	+	<Footer />
139	+	</>
140	+	)
141	+	}
142	+
143	+	export default Dashboard

gistfile1.txt(vytvořil soubor)

		@@ -0,0 +1,119 @@
1	+	import Navbar from '@/components/Navbar'
2	+	import Footer from '@/components/Footer'
3	+
4	+	import Head from 'next/head'
5	+	import Card from '@/components/DashboardCard'
6	+	import PopupForm from '@/components/DashboardCreateEntity'
7	+
8	+	import useSWR from 'swr'
9	+
10	+	import { useState, useEffect } from 'react'
11	+	import Link from 'next/link'
12	+	import { useRouter } from 'next/router'
13	+
14	+	const Dashboard = ({ data }) => {
15	+	const router = useRouter()
16	+	const [isPopupVisible, setPopupVisibility] = useState(false)
17	+
18	+	//let { data } = useSWR('/api/whatever')
19	+	//let { data } = useSWR('https://api.whatever.com')
20	+	/**
21	+	* let {data, error } = useSWR('/api/whatever')
22	+	* if (error) return whetever
23	+	*
24	+	*/
25	+
26	+	const handleCreateButtonClick = () => {
27	+	setPopupVisibility(true)
28	+	}
29	+
30	+	const handleClosePopup = () => {
31	+	setPopupVisibility(false)
32	+	}
33	+
34	+	useEffect(() => {
35	+	const handleMousemove = (e) => {
36	+	const rect = e.currentTarget.getBoundingClientRect();
37	+	const x = e.clientX - rect.left;
38	+	const y = e.clientY - rect.top;
39	+
40	+	e.currentTarget.style.setProperty("--mouse-x", `${x}px`);
41	+	e.currentTarget.style.setProperty("--mouse-y", `${y}px`);
42	+	};
43	+	document.querySelectorAll(".dashboard_entity_card").forEach((card) => {
44	+	card.addEventListener("mousemove", handleMousemove);
45	+	return () => {
46	+	card.removeEventListener("mousemove", handleMousemove);
47	+	};
48	+	});
49	+	}, []);
50	+
51	+
52	+	return (
53	+	<>
54	+	<Head>
55	+	<title>Dashboard - Assistify</title>
56	+	</Head>
57	+	<Navbar user={data}/>
58	+	{Object.keys(data).length !== 0 ? (
59	+	<>
60	+	<main className="dashboard_div">
61	+	<div className="dashboard_headings">
62	+	<h1 className="heading_color">Welcome, {data.name} 👋</h1>
63	+	{/* <button className="cta">
64	+	<span>Create</span>
65	+	<svg viewBox="0 0 13 10" height="10px" width="15px">
66	+	<path d="M1,5 L11,5"></path>
67	+	<polyline points="8 1 12 5 8 9"></polyline>
68	+	</svg>
69	+	</button> */}
70	+	<div className="showcase_buttons">
71	+	<button className="btn" onClick={handleCreateButtonClick}>
72	+	<svg
73	+	height="24"
74	+	width="24"
75	+	fill="#FFFFFF"
76	+	viewBox="0 0 24 24"
77	+	data-name="Layer 1"
78	+	id="Layer_1"
79	+	className="sparkle"
80	+	>
81	+	<path d="M10,21.236,6.755,14.745.264,11.5,6.755,8.255,10,1.764l3.245,6.491L19.736,11.5l-6.491,3.245ZM18,21l1.5,3L21,21l3-1.5L21,18l-1.5-3L18,18l-3,1.5ZM19.333,4.667,20.5,7l1.167-2.333L24,3.5,21.667,2.333,20.5,0,19.333,2.333,17,3.5Z"></path>
82	+	</svg>
83	+
84	+	<span className="text">Create</span>
85	+	</button>
86	+	</div>
87	+	{isPopupVisible && <PopupForm onClose={handleClosePopup} router={router}/>}
88	+	</div>
89	+	<div className="dashboard_entities">
90	+	{data.entities.length !== 0 ? (
91	+	data.entities?.map((entity, index) => {
92	+	return (
93	+	<Link key={index} href={`/entity/${entity.id}`}>
94	+	<Card title={entity.name} key={index} id={entity.id} />
95	+	</Link>
96	+	)
97	+	})
98	+	) : (
99	+	<div
100	+	style={{
101	+	color: '#ddd'
102	+	}}
103	+	>
104	+	You haven't created any entities yet.
105	+	</div>
106	+	)}
107	+	</div>
108	+	</main>
109	+	</>
110	+	) : (
111	+	/* Work on this, show a error */
112	+	Error
113	+	)}
114	+	<Footer />
115	+	</>
116	+	)
117	+	}
118	+
119	+	export default Dashboard

Novější Starší