diff --git a/frontend/src/lib/search-card.svelte b/frontend/src/lib/search-card.svelte new file mode 100644 index 0000000..01ae7c8 --- /dev/null +++ b/frontend/src/lib/search-card.svelte @@ -0,0 +1,26 @@ + + +
+ +
+ +
+

+ {quiz.title} +

+

{quiz.description}

+
+
+ {$t('explore_page.made_by')} {quiz.user} +
+
+ +
diff --git a/frontend/src/lib/stores.ts b/frontend/src/lib/stores.ts index 401d453..787788c 100644 --- a/frontend/src/lib/stores.ts +++ b/frontend/src/lib/stores.ts @@ -5,3 +5,38 @@ export const signedIn = writable(false); export const pathname = writable('/'); export const alertModal = writable({ open: false, title: '', body: '' }); + +import { goto } from '$app/navigation'; +import { page } from '$app/stores'; + +const URLSearchParamsToObject = (params: URLSearchParams) => { + let obj = {}; + params.forEach((v: string, k: string) => { + obj[k] = v; + }); + return obj; +}; + +export const createQueryParamsStore = (key: string) => { + let params; + page.subscribe((v) => { + params = URLSearchParamsToObject(v.url.searchParams); + }); + + return { + subscribe: (cb: Function) => { + return page.subscribe((p) => { + cb(p.url.searchParams.get(key)); + }); + }, + set: (value: string) => { + params[key] = value; + const urlSearchParams = new URLSearchParams(params); + goto(`?${urlSearchParams.toString()}`, { + keepfocus: true, + replaceState: true, + noscroll: true + }); + } + }; +}; diff --git a/frontend/src/routes/explore.svelte b/frontend/src/routes/explore.svelte index a4bebcc..7f873bc 100644 --- a/frontend/src/routes/explore.svelte +++ b/frontend/src/routes/explore.svelte @@ -12,6 +12,7 @@