Websites/liljudd-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity

Fix: Cleanup and SSR auth header fix

Browse source
This commit is contained in:
Aron Malcher 2024-02-11 23:01:42 +01:00
parent b28ceb8659
commit 2b9b5198fa
Signed by: aronmal
GPG key ID: 816B7707426FC612
5 changed files with 92 additions and 128 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/NavUser.tsx
View file

@ -46,13 +46,13 @@ async function getUser() {
} }
function NavUser() { function NavUser() {
const [user] = createResource(() => const [user] = createResource(async () => {
getUser().then((e) => { const user = await getUser();
if (!e.success) console.log(1, e.message);
console.log(2, e); if (!user.success) console.error("userInfo", user.message);
return e;
}), return user;
); });
return ( return (
<Show <Show

7
src/routes/api/config/[guildId].tsx
View file

@ -29,8 +29,6 @@ export const GET = async (
{ success: false; message: string } | (data & { success: true }) { success: false; message: string } | (data & { success: true })
> => { > => {
const id = event.params.guildId; const id = event.params.guildId;
// const id = "598539452343648256";
// const location = useLocation();
if (!event) return { success: false, message: "No request event!" }; if (!event) return { success: false, message: "No request event!" };
const session = await getSession(event.request, authOptions); const session = await getSession(event.request, authOptions);
@ -62,9 +60,8 @@ export const GET = async (
}, },
headers: { Authorization: `Bot ${import.meta.env.VITE_DISCORD_BOT_TOKEN}` }, headers: { Authorization: `Bot ${import.meta.env.VITE_DISCORD_BOT_TOKEN}` },
}); });
if (guildsRequest.error || channelsRequest.error) { if (guildsRequest.error || channelsRequest.error) {
console.log(guildsRequest.error, channelsRequest.error, location.pathname); console.log(guildsRequest.error, channelsRequest.error, event.path);
return { return {
success: false, success: false,
message: "Error on one of the discord api requests!", message: "Error on one of the discord api requests!",
@ -94,8 +91,6 @@ export const GET = async (
}); });
}); });
console.log("done");
return { return {
success: true, success: true,
guild: { guild: {

2
src/routes/api/config/index.tsx
View file

@ -45,8 +45,6 @@ export const GET = async (
headers: { Authorization: `Bearer ${DISCORD_ACCESS_TOKEN}` }, headers: { Authorization: `Bearer ${DISCORD_ACCESS_TOKEN}` },
}); });
console.log("guilds", guilds);
if (error) { if (error) {
console.log(error); console.log(error);
return { success: false, message: "Error on discord api request!" }; return { success: false, message: "Error on discord api request!" };

67
src/routes/config/[guildId].tsx
View file

@ -8,6 +8,7 @@ import {
createSignal, createSignal,
} from "solid-js"; } from "solid-js";
import { createStore } from "solid-js/store"; import { createStore } from "solid-js/store";
import { getRequestEvent } from "solid-js/web";
import { FontAwesomeIcon } from "~/components/FontAwesomeIcon"; import { FontAwesomeIcon } from "~/components/FontAwesomeIcon";
import Layout from "~/components/Layout"; import Layout from "~/components/Layout";
import "../../styles/pages/config.scss"; import "../../styles/pages/config.scss";
@ -30,6 +31,8 @@ function config() {
const params = useParams(); const params = useParams();
const navigator = useNavigate(); const navigator = useNavigate();
const location = useLocation(); const location = useLocation();
const event = getRequestEvent();
const [timezoneRef, setTimezoneRef] = createSignal<HTMLInputElement>(); const [timezoneRef, setTimezoneRef] = createSignal<HTMLInputElement>();
const [timePlanningRef, setTimePlanningRef] = const [timePlanningRef, setTimePlanningRef] =
createSignal<HTMLInputElement>(); createSignal<HTMLInputElement>();
@ -41,7 +44,9 @@ function config() {
const [payload] = createResource( const [payload] = createResource(
params.guildId, params.guildId,
async (id) => { async (id) => {
const payload = await fetch(`http://localhost:3000/api/config/${id}`) const payload = await fetch(`http://localhost:3000/api/config/${id}`, {
headers: event?.headers,
})
.then( .then(
(res) => (res) =>
res.json() as Promise< res.json() as Promise<
@ -56,17 +61,24 @@ function config() {
) )
.catch((e) => console.warn(e, id)); .catch((e) => console.warn(e, id));
if (!payload) return initialValue(params); if (!payload) {
console.error(location.pathname, payload);
return initialValue(params);
}
if (!payload.success) { if (!payload.success) {
console.log(payload); console.log(payload);
console.log(location.pathname, payload.message, "No success"); console.log(location.pathname, payload.message, "No success");
// navigator("/config", { replace: false }); navigator("/config", { replace: false });
return initialValue(params); return initialValue(params);
} }
return payload; return payload;
}, },
{ initialValue: initialValue(params) }, {
initialValue: initialValue(params),
deferStream: true,
},
); );
const [config, setConfig] = createStore({ const [config, setConfig] = createStore({
features: { features: {
@ -78,53 +90,13 @@ function config() {
}, },
}); });
createEffect(() => console.log(payload.loading, payload()));
createEffect(() => console.log("timezone", timezone()));
createEffect(() =>
console.log("timePlanning.enabled", config.features.timePlanning.enabled),
);
createEffect(() =>
console.log(
"timePlanning.channelId",
config.features.timePlanning.channelId,
),
);
createEffect(() =>
console.log(
"timePlanning.pingableRoles",
config.features.timePlanning.pingableRoles,
),
);
createEffect(() => {
const ref = timezoneRef();
if (!ref) return;
ref.value = timezone();
});
createEffect(() => {
const ref = timePlanningRef();
if (!ref) return;
ref.checked = config.features.timePlanning.enabled;
});
createEffect(() => { createEffect(() => {
const channelId = payload().guild.channel; const channelId = payload().guild.channel;
setConfig("features", "timePlanning", "channelId", channelId); setConfig("features", "timePlanning", "channelId", channelId);
console.log(channelId, payload());
const ref = channelRef(); const ref = channelRef();
if (!ref) return; if (!ref) return;
if (
!ref ||
!channelId ||
!payload().guild.channels.find((e) => e.id === channelId)
)
return;
ref.value = channelId; ref.value = channelId;
}); });
createEffect(() => {
const ref = pingableRolesRef();
if (!ref) return;
ref.checked = config.features.timePlanning.pingableRoles;
});
createEffect(() => { createEffect(() => {
const ref = timezoneRef(); const ref = timezoneRef();
if (!ref) return; if (!ref) return;
@ -141,8 +113,6 @@ function config() {
ref.checked = config.features.timePlanning.pingableRoles; ref.checked = config.features.timePlanning.pingableRoles;
}); });
// console.log(payload());
return ( return (
<Layout site="config"> <Layout site="config">
<h3 class="text-center">Configure li&apos;l Judd in</h3> <h3 class="text-center">Configure li&apos;l Judd in</h3>
@ -232,10 +202,7 @@ function config() {
) )
} }
> >
<option <option disabled value="">
disabled={!!config.features.timePlanning.channelId}
value=""
>
--Select a Channel-- --Select a Channel--
</option> </option>
<For each={payload().guild.channels}> <For each={payload().guild.channels}>

130
src/routes/config/index.tsx
View file

@ -3,8 +3,9 @@ import {
faCircleExclamation, faCircleExclamation,
faPlus, faPlus,
} from "@fortawesome/pro-regular-svg-icons"; } from "@fortawesome/pro-regular-svg-icons";
import { useLocation, useNavigate } from "@solidjs/router"; import { useNavigate } from "@solidjs/router";
import { For, Suspense, createEffect, createResource } from "solid-js"; import { For, createResource } from "solid-js";
import { getRequestEvent } from "solid-js/web";
import { FontAwesomeIcon } from "~/components/FontAwesomeIcon"; import { FontAwesomeIcon } from "~/components/FontAwesomeIcon";
import Layout from "~/components/Layout"; import Layout from "~/components/Layout";
import "../../styles/pages/config.scss"; import "../../styles/pages/config.scss";
@ -20,38 +21,43 @@ const initialValue = () => ({
function index() { function index() {
const navigator = useNavigate(); const navigator = useNavigate();
const location = useLocation(); const event = getRequestEvent();
const [payload] = createResource(async () => { const [payload] = createResource(
const payload = await fetch("http://localhost:3000/api/config") // eslint-disable-next-line solid/reactivity
.then( async () => {
(res) => const payload = await fetch("http://localhost:3000/api/config", {
res.json() as Promise< headers: event?.headers,
| { })
success: false; .then(
message: string; (res) =>
} res.json() as Promise<
| (ReturnType<typeof initialValue> & { | {
success: true; success: false;
}) message: string;
>, }
) | (ReturnType<typeof initialValue> & {
.catch((e) => console.warn(e)); success: true;
})
>,
)
.catch((e) => console.warn(e));
if (!payload) return; if (!payload) {
console.error("/config", payload);
return initialValue();
}
if (!payload.success) { if (!payload.success) {
console.log(location.pathname, payload.message, "No success"); console.log("/config", payload.message, "No success");
navigator("/", { replace: false }); navigator("/", { replace: false });
return initialValue(); return initialValue();
} }
console.log(location.pathname, "success");
return payload; return payload;
}); },
createEffect(() => console.log(payload()?.guilds, payload()?.guilds.length)); { deferStream: true },
// createRenderEffect(() => );
// console.log(payload()?.guilds, payload()?.guilds.length),
// );
const icons = [faPlus, faCircleExclamation, faBadgeCheck]; const icons = [faPlus, faCircleExclamation, faBadgeCheck];
const colors = [undefined, "orange", "green"]; const colors = [undefined, "orange", "green"];
@ -60,39 +66,37 @@ function index() {
<Layout site="config"> <Layout site="config">
<h3 class="text-center">Configure li&apos;l Judd in</h3> <h3 class="text-center">Configure li&apos;l Judd in</h3>
<div> <div>
<Suspense> <For each={payload()?.guilds}>
<For each={payload()?.guilds}> {(guild, i) => {
{(guild, i) => { return (
return ( <a
<a href={
href={ i() % 3 === 0
i() % 3 === 0 ? `/config/${guild.id}`
? `/config/${guild.id}` : `https://discord.com/api/oauth2/authorize?client_id=${import.meta.env.VITE_DISCORD_CLIENT_ID}&permissions=${import.meta.env.VITE_DISCORD_BOT_PERMISSIONS}&scope=bot&guild_id=${guild.id}`
: `https://discord.com/api/oauth2/authorize?client_id=${import.meta.env.VITE_DISCORD_CLIENT_ID}&permissions=${import.meta.env.VITE_DISCORD_BOT_PERMISSIONS}&scope=bot&guild_id=${guild.id}` }
class="flex-row centered"
>
<img
class="guildpfp"
src={
guild.icon
? `https://cdn.discordapp.com/icons/${guild.id}/${guild.icon}.webp?size=240`
: "https://cdn.discordapp.com/icons/1040502664506646548/bb5a51c4659cf47bdd942bb11e974da7.webp?size=240"
} }
class="flex-row centered" alt="Server pfp"
> />
<img <h1>{guild.name}</h1>
class="guildpfp" <FontAwesomeIcon
src={ // beat={i() % 3 === 1}
guild.icon color={colors[i() % 3]}
? `https://cdn.discordapp.com/icons/${guild.id}/${guild.icon}.webp?size=240` icon={icons[i() % 3]}
: "https://cdn.discordapp.com/icons/1040502664506646548/bb5a51c4659cf47bdd942bb11e974da7.webp?size=240" size="xl"
} />
alt="Server pfp" </a>
/> );
<h1>{guild.name}</h1> }}
<FontAwesomeIcon </For>
// beat={i() % 3 === 1}
color={colors[i() % 3]}
icon={icons[i() % 3]}
size="xl"
/>
</a>
);
}}
</For>
</Suspense>
</div> </div>
</Layout> </Layout>
); );