idk, didnt wanna do this, i thought i wouldnt need it but it seems i do

DeepDoge · Nov 16, 2024 · 5321a3b · 5321a3b
1 parent 10b9f60
commit 5321a3b
Show file tree

Hide file tree

Showing 4 changed files with 88 additions and 38 deletions.
diff --git a/project/app/src/app/layout/Main.ts b/project/app/src/app/layout/Main.ts
@@ -1,4 +1,4 @@
-import { awaited, computed, tags } from "@purifyjs/core";
+import { computed, ref, tags } from "@purifyjs/core";
 import { menuSearchParam } from "~/app/layout/routes";
 import { router } from "~/app/router";
 import { layoutBrakpoint } from "~/app/styles";
@@ -9,54 +9,78 @@ import { config } from "~/shared/config";
 import { BackSvg } from "~/shared/svgs/BackSvg";
 import { CloseSvg } from "~/shared/svgs/CloseSvg";
 import { css, useScope } from "~/shared/utils/css";
+import { match } from "~/shared/utils/match";
 
 // TODO: seperate route and post section into two different files later.
 
 const { section, main, header, a, strong } = tags;
 
 export function Main() {
-	return main()
-		.effect(useScope(MainCss))
-		.children(
-			router.route.derive((route) => {
-				if (!route) return null;
-				return section({ class: "route" })
-					.ariaLabel(route.title)
+	const host = main();
+
+	const post = ref<Post | null>(null);
+	host.effect(() => {
+		const postPromise = computed(() => ({
+			searchParam: postSearchParam.val,
+			config: config.val,
+		})).derive(({ searchParam, config }) => {
+			if (!searchParam) return null;
+			return Post.loadWithSearchParam(searchParam, config);
+		});
+
+		return postPromise.follow((promise) => {
+			if (!promise) {
+				post.val = null;
+				return;
+			}
+
+			promise.then((resultPost) => {
+				if (promise !== postPromise.val) return;
+				post.val = resultPost;
+			});
+		}, true);
+	});
+
+	return host.effect(useScope(MainCss)).children(
+		match(router.route)
+			.if((route) => route !== null)
+			.then((route) =>
+				section({ class: "route" })
+					.ariaLabel(route.derive((route) => route.title))
 					.children(
 						header().children(
 							a({ class: "icon back" })
 								.ariaHidden("true")
 								.href(menuSearchParam.toHref("open"))
 								.children(BackSvg()),
-							strong().textContent(route.title),
-							route.renderHeaderEnd(),
+							route.derive((route) => [
+								strong().textContent(route.title),
+								route.renderHeaderEnd(),
+							]),
 						),
-						route.render(),
-					);
-			}),
-			computed(() => ({ searchParam: postSearchParam.val, config: config.val })).derive(
-				({ searchParam, config }) =>
-					awaited(
-						Post.loadWithSearchParam(searchParam, config).then((post) => {
-							if (!post) return null;
-
-							return section({ class: "post" })
-								.role("complementary")
-								.ariaLabel("Post")
-								.children(
-									header().children(
-										a({ class: "icon close" })
-											.ariaHidden("true")
-											.href(postSearchParam.toHref(null))
-											.children(CloseSvg()),
-										strong().textContent("Post"),
-									),
-									PostThread(post),
-								);
-						}),
+						route.derive((route) => route.render()),
 					),
-			),
-		);
+			)
+			.else(() => null),
+		match(post)
+			.if((post) => post !== null)
+			.then((post) => {
+				return section({ class: "post" })
+					.role("complementary")
+					.ariaLabel("Post")
+					.children(
+						header().children(
+							a({ class: "icon close" })
+								.ariaHidden("true")
+								.href(postSearchParam.toHref(null))
+								.children(CloseSvg()),
+							strong().textContent("Post"),
+						),
+						post.derive(PostThread),
+					);
+			})
+			.else(() => null),
+	);
 }
 
 export const MainCss = css`

diff --git a/project/app/src/features/feed/components/FeedForm.ts b/project/app/src/features/feed/components/FeedForm.ts
@@ -166,7 +166,6 @@ const PostFormCss = css`
 		grid-auto-flow: column;
 		justify-content: space-between;
 		align-items: center;
-		font-size: 0.75em;
 	}
 
 	label {

diff --git a/project/app/src/features/post/Post.ts b/project/app/src/features/post/Post.ts
@@ -41,8 +41,7 @@ export class Post {
 		return `${chainId.toString(16)}-${indexerAddress.slice(2)}-${feedId.slice(2)}-${index.toString(16)}` as const;
 	}
 
-	public static async loadWithSearchParam(value: string | null, config: Config) {
-		if (!value) return null;
+	public static async loadWithSearchParam(value: string, config: Config) {
 		const [
 			chainIdHex0xOmitted,
 			indexerAddressHex0xOmitted,

diff --git a/project/app/src/shared/utils/match.ts b/project/app/src/shared/utils/match.ts
@@ -0,0 +1,28 @@
+import { ref, Signal } from "@purifyjs/core";
+
+export function match<T>(signal: Signal<T>) {
+	return {
+		if<U extends T>(condition: (value: T) => value is U) {
+			return {
+				then<Then>(thenDerive: (signal: Signal<Extract<T, U>>) => Then) {
+					return {
+						else<Else>(
+							elseDerive: (signal: Signal<Exclude<T, U>>) => Else,
+						): Signal<Then | Else> {
+							return ref<Then | Else>(null!, (set) =>
+								signal.derive(condition).follow((isThen) => {
+									console.log(isThen);
+									if (isThen) {
+										return set(thenDerive(signal as never));
+									} else {
+										return set(elseDerive(signal as never));
+									}
+								}, true),
+							);
+						},
+					};
+				},
+			};
+		},
+	};
+}