Skip to content

Commit

Permalink
fix: prejoin issue
Browse files Browse the repository at this point in the history
when redirecting back from a room, the app was permanently broken until a refresh, due to query caching
  • Loading branch information
George-Spanos committed May 29, 2024
1 parent 9bb21df commit 1687be5
Showing 1 changed file with 10 additions and 8 deletions.
18 changes: 10 additions & 8 deletions ui/src/pages/prejoin/prejoinForm.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { useNavigate, useSearchParams } from "@solidjs/router";
import { Component, createEffect, createSignal, onMount, Show } from "solid-js";
import { Component, createEffect, createSignal, onCleanup, onMount, Show } from "solid-js";
import {
BrowserStorageKeys,
isSpectator,
Expand All @@ -15,33 +15,35 @@ import { apiV1Url } from "../../config";
import "./prejoinForm.css";
import anime from 'animejs/lib/anime.es.js';
import { fade } from "../home/animations";
import { createQuery } from "@tanstack/solid-query";
import { createQuery, useQueryClient } from "@tanstack/solid-query";

const PrejoinForm: Component = () => {

const queryClient = useQueryClient();
const roomQueryKey = 'createRoomQuery';
const createRoomQuery = createQuery<string>(() => ({
queryKey: ['createRoomQuery'],
queryKey: [roomQueryKey],
queryFn: createRoom,
enabled: false
}));
createEffect(() => {
if (createRoomQuery.data) {
setRoomId(createRoomQuery.data);
navigate(`/room/${roomId()}`);
navigate(`/room/${roomId()}`, { replace: true });
}
});
onMount(() => {
anime(fade('.prejoin-form'));
});
onCleanup(() => {
queryClient.resetQueries({ queryKey: [roomQueryKey] });
});
const navigate = useNavigate();
const [params] = useSearchParams<{ create: string; }>();
const isCreatingRoom = Boolean(params.create);
const title = isCreatingRoom ? "Create a New Room" : "Joining Room";
const buttonText = isCreatingRoom ? "create room" : "join room";
const [usernameError, setUsernameError] = createSignal<string | null>(null);
createEffect(() => {
console.log(createRoomQuery.status);
});

const handleInputChanged = (event: KeyboardEvent) => {
try {
// @ts-ignore
Expand Down

0 comments on commit 1687be5

Please sign in to comment.