2021-04-02 16:14:50 -04:00
|
|
|
import React, { useEffect, useState } from "react";
|
2021-04-03 21:01:00 -04:00
|
|
|
import { AuthProvider, useAuth } from "components/Login/AuthContext";
|
|
|
|
import Login from "components/Login";
|
2021-04-01 18:26:56 -04:00
|
|
|
import Analytics from "components/Analytics";
|
|
|
|
import Editor from "components/Editor";
|
|
|
|
import { EditableLink } from "components/Editor/Link";
|
2021-03-31 00:28:08 -04:00
|
|
|
|
2021-04-02 16:14:50 -04:00
|
|
|
const EditorPage: React.FC = () => {
|
2021-04-03 21:01:00 -04:00
|
|
|
const { loggedIn, headers } = useAuth();
|
2021-04-02 16:14:50 -04:00
|
|
|
const [links, setLinks] = useState<EditableLink[]>([]);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
async function fetchLinks() {
|
2021-04-03 21:01:00 -04:00
|
|
|
if (!loggedIn) return;
|
2021-04-02 16:14:50 -04:00
|
|
|
|
2021-04-03 21:01:00 -04:00
|
|
|
const res = await fetch("/api/editor/links", { headers });
|
|
|
|
const links = await res.json();
|
|
|
|
setLinks(links);
|
2021-04-02 16:14:50 -04:00
|
|
|
}
|
2021-03-31 00:28:08 -04:00
|
|
|
|
2021-04-02 16:14:50 -04:00
|
|
|
fetchLinks();
|
2021-04-03 21:01:00 -04:00
|
|
|
}, [loggedIn, headers]);
|
2021-04-01 18:26:56 -04:00
|
|
|
|
2021-04-03 21:01:00 -04:00
|
|
|
return loggedIn ? (
|
2021-04-07 18:05:07 -04:00
|
|
|
<div>
|
2021-04-03 21:01:00 -04:00
|
|
|
<Analytics clicks={links.reduce((acc, curr) => acc + curr.clicks, 0)} />
|
2021-04-01 18:26:56 -04:00
|
|
|
<Editor links={links} setLinks={setLinks} />
|
2021-04-07 18:05:07 -04:00
|
|
|
</div>
|
2021-04-01 18:26:56 -04:00
|
|
|
) : (
|
2021-04-03 21:01:00 -04:00
|
|
|
<Login />
|
2021-04-01 18:26:56 -04:00
|
|
|
);
|
2021-03-31 00:28:08 -04:00
|
|
|
};
|
|
|
|
|
2021-04-02 16:14:50 -04:00
|
|
|
export default function EditorPageWrapper(): JSX.Element {
|
2021-03-31 00:28:08 -04:00
|
|
|
return (
|
|
|
|
<AuthProvider>
|
2021-04-02 16:14:50 -04:00
|
|
|
<EditorPage />
|
2021-03-31 00:28:08 -04:00
|
|
|
</AuthProvider>
|
|
|
|
);
|
2021-04-01 18:26:56 -04:00
|
|
|
}
|