HyperNet/Interactive
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: HyperNet:7ab1b128dff5c2c3529434e802fde3501b3ec3dd
Branches Tags
HyperNet:master
...
compare: HyperNet:3f005a7c5fc498da94a52eae93abe9f30ea0aa8b
Branches Tags
HyperNet:master

3 Commits
7ab1b128df ... 3f005a7c5f

Author SHA1 Message Date
LittleSheep
3f005a7c5f ✨ Markdown content 2024-02-05 21:56:18 +08:00
LittleSheep
9bc270c12f ✨ Login promote 2024-02-05 21:47:17 +08:00
LittleSheep
f8f8c3c3b5 🐛 Fix attachments display 2024-02-05 21:27:19 +08:00
5 changed files with 79 additions and 54 deletions
Show Stats Expand all files Collapse all files

4
pkg/view/package.json
View File

@ -17,11 +17,13 @@
"hls.js": "^1.5.3", "hls.js": "^1.5.3",
"medium-zoom": "^1.1.0", "medium-zoom": "^1.1.0",
"solid-js": "^1.8.7", "solid-js": "^1.8.7",
"solid-markdown": "^2.0.0",
"universal-cookie": "^7.0.2" "universal-cookie": "^7.0.2"
}, },
"devDependencies": { "devDependencies": {
"@tailwindcss/typography": "^0.5.10",
"autoprefixer": "^10.4.17", "autoprefixer": "^10.4.17",
"daisyui": "^4.6.0", "daisyui": "^4.6.1",
"postcss": "^8.4.33", "postcss": "^8.4.33",
"solid-devtools": "^0.29.3", "solid-devtools": "^0.29.3",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",

2
pkg/view/src/components/PostAttachments.tsx
View File

@ -101,7 +101,7 @@ export default function PostAttachments(props: { attachments: any[] }) {
} }
function getUrl(item: any): string { function getUrl(item: any): string {
return item.external_url ?? `/api/attachments/o/${item.file_id}`; return item.external_url ? item.external_url : `/api/attachments/o/${item.file_id}`;
} }
createEffect(() => { createEffect(() => {

108
pkg/view/src/components/PostItem.tsx
View File

@ -1,6 +1,7 @@
import { createSignal, For, Show } from "solid-js"; import { createSignal, For, Show } from "solid-js";
import { getAtk, useUserinfo } from "../stores/userinfo.tsx"; import { getAtk, useUserinfo } from "../stores/userinfo.tsx";
import PostAttachments from "./PostAttachments.tsx"; import PostAttachments from "./PostAttachments.tsx";
import { SolidMarkdown } from "solid-markdown";
export default function PostItem(props: { export default function PostItem(props: {
post: any, post: any,
@ -55,18 +56,20 @@ export default function PostItem(props: {
</a> </a>
</Show> </Show>
<div class="py-5 px-7"> <div class="px-7">
<h2 class="card-title">{props.post.title}</h2> <h2 class="card-title">{props.post.title}</h2>
<article class="prose">{props.post.content}</article> <article class="prose">
<SolidMarkdown children={props.post.content} />
</article>
<div class="mt-2 flex gap-2"> <div class="mt-2 flex gap-2">
<For each={props.post.categories}> <For each={props.post.categories}>
{item => <a class="link link-primary"> {item => <a class="link link-primary pb-5">
#{item.name} #{item.name}
</a>} </a>}
</For> </For>
<For each={props.post.tags}> <For each={props.post.tags}>
{item => <a class="link link-primary"> {item => <a class="link link-primary pb-5">
#{item.name} #{item.name}
</a>} </a>}
</For> </For>
@ -105,53 +108,62 @@ export default function PostItem(props: {
</div> </div>
<Show when={!props.noControl}> <Show when={!props.noControl}>
<div class="grid grid-cols-3 border-y border-base-200"> <div class="relative">
<div class="grid grid-cols-2"> <Show when={!userinfo?.isLoggedIn}>
<div class="tooltip" data-tip="Daisuki"> <div
<button type="button" class="btn btn-ghost btn-block" disabled={reacting()} class="px-7 py-2.5 h-12 w-full opacity-0 transition-opacity hover:opacity-100 bg-base-100 border-t border-base-200 z-[1] absolute top-0 left-0">
onClick={() => reactPost(props.post, "like")}> <b>Login!</b> To access entire platform.
<i class="fa-solid fa-thumbs-up"></i>
<code class="font-mono">{props.post.like_count}</code>
</button>
</div> </div>
</Show>
<div class="tooltip" data-tip="Daikirai"> <div class="grid grid-cols-3 border-y border-base-200">
<button type="button" class="btn btn-ghost btn-block" disabled={reacting()} <div class="grid grid-cols-2">
onClick={() => reactPost(props.post, "dislike")}> <div class="tooltip" data-tip="Daisuki">
<i class="fa-solid fa-thumbs-down"></i> <button type="button" class="btn btn-ghost btn-block" disabled={reacting()}
<code class="font-mono">{props.post.dislike_count}</code> onClick={() => reactPost(props.post, "like")}>
</button> <i class="fa-solid fa-thumbs-up"></i>
</div> <code class="font-mono">{props.post.like_count}</code>
</div> </button>
</div>
<div class="col-span-2 flex justify-end">
<div class="tooltip" data-tip="Reply"> <div class="tooltip" data-tip="Daikirai">
<button type="button" class="btn btn-ghost btn-block" <button type="button" class="btn btn-ghost btn-block" disabled={reacting()}
onClick={() => props.onReply && props.onReply(props.post)}> onClick={() => reactPost(props.post, "dislike")}>
<i class="fa-solid fa-reply"></i> <i class="fa-solid fa-thumbs-down"></i>
</button> <code class="font-mono">{props.post.dislike_count}</code>
</div> </button>
</div>
<div class="tooltip" data-tip="Repost"> </div>
<button type="button" class="btn btn-ghost btn-block"
onClick={() => props.onRepost && props.onRepost(props.post)}> <div class="col-span-2 flex justify-end">
<i class="fa-solid fa-retweet"></i> <div class="tooltip" data-tip="Reply">
</button> <button type="button" class="btn btn-ghost btn-block"
</div> onClick={() => props.onReply && props.onReply(props.post)}>
<i class="fa-solid fa-reply"></i>
<div class="dropdown dropdown-end"> </button>
<div tabIndex="0" role="button" class="btn btn-ghost w-12"> </div>
<i class="fa-solid fa-ellipsis-vertical"></i>
<div class="tooltip" data-tip="Repost">
<button type="button" class="btn btn-ghost btn-block"
onClick={() => props.onRepost && props.onRepost(props.post)}>
<i class="fa-solid fa-retweet"></i>
</button>
</div>
<div class="dropdown dropdown-end">
<div tabIndex="0" role="button" class="btn btn-ghost w-12">
<i class="fa-solid fa-ellipsis-vertical"></i>
</div>
<ul tabIndex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-52">
<Show when={userinfo?.profiles?.id === props.post.author_id}>
<li><a onClick={() => props.onDelete && props.onDelete(props.post)}>Delete</a></li>
</Show>
<Show when={userinfo?.profiles?.id === props.post.author_id}>
<li><a onClick={() => props.onEdit && props.onEdit(props.post)}>Edit</a></li>
</Show>
<li><a>Report</a></li>
</ul>
</div> </div>
<ul tabIndex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-52">
<Show when={userinfo?.profiles?.id === props.post.author_id}>
<li><a onClick={() => props.onDelete && props.onDelete(props.post)}>Delete</a></li>
</Show>
<Show when={userinfo?.profiles?.id === props.post.author_id}>
<li><a onClick={() => props.onEdit && props.onEdit(props.post)}>Edit</a></li>
</Show>
<li><a>Report</a></li>
</ul>
</div> </div>
</div> </div>
</div> </div>

17
pkg/view/src/components/PostPublish.tsx
View File

@ -15,6 +15,17 @@ export default function PostPublish(props: {
}) { }) {
const userinfo = useUserinfo(); const userinfo = useUserinfo();
if (!userinfo?.isLoggedIn) {
return (
<div class="py-9 flex justify-center items-center">
<div class="text-center">
<h2 class="text-lg font-bold">Login!</h2>
<p>Or keep silent.</p>
</div>
</div>
);
}
const [submitting, setSubmitting] = createSignal(false); const [submitting, setSubmitting] = createSignal(false);
const [uploading, setUploading] = createSignal(false); const [uploading, setUploading] = createSignal(false);
@ -61,8 +72,8 @@ export default function PostPublish(props: {
props.onError(await res.text()); props.onError(await res.text());
} else { } else {
form.reset(); form.reset();
props.onPost();
props.onError(null); props.onError(null);
setTimeout(() => props.onPost(), 250);
} }
setSubmitting(false); setSubmitting(false);
} }
@ -97,8 +108,8 @@ export default function PostPublish(props: {
props.onError(await res.text()); props.onError(await res.text());
} else { } else {
form.reset(); form.reset();
props.onPost();
props.onError(null); props.onError(null);
setTimeout(() => props.onPost(), 250);
} }
setSubmitting(false); setSubmitting(false);
} }
@ -135,7 +146,7 @@ export default function PostPublish(props: {
setAttachments(attachments().concat([{ setAttachments(attachments().concat([{
...data, ...data,
author_id: userinfo?.profiles?.id, author_id: userinfo?.profiles?.id
}])); }]));
form.reset(); form.reset();
} }

2
pkg/view/tailwind.config.js
View File

@ -39,6 +39,6 @@ export default {
} }
] ]
}, },
plugins: [require("daisyui")] plugins: [require("daisyui"), require("@tailwindcss/typography")]
}; };