@jant/core 0.3.35 → 0.3.37

package/src/ui/shared/PostFooter.tsx

@@ -0,0 +1,204 @@
+/**
+ * Post Footer
+ *
+ * Shared footer for all post cards (feed + detail page).
+ * Shows timestamp, collection tags, reply button, and menu trigger.
+ */
+
+import type { FC } from "hono/jsx";
+import { useLingui } from "@lingui/react/macro";
+import type {
+  PostView,
+  CollectionTagView,
+  PostFooterDisplayOptions,
+} from "../../types.js";
+import { sanitizeUrl } from "../../lib/url.js";
+
+interface PostFooterProps {
+  post: PostView;
+  /** Detail page variant: border-top, shows permalink */
+  detail?: boolean;
+  display?: PostFooterDisplayOptions;
+}
+
+const CollectionTags: FC<{ collections: CollectionTagView[] }> = ({
+  collections,
+}) => {
+  if (collections.length === 0) return null;
+
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- length checked above
+  const first = collections[0]!;
+  const rest = collections.slice(1);
+
+  return (
+    <span class="post-collection-tags">
+      <span class="post-collection-sep" aria-hidden="true">
+        &middot;
+      </span>
+      <a href={`/c/${first.slug}`} class="post-collection-tag">
+        {first.iconHtml && (
+          <span
+            class="post-collection-icon"
+            dangerouslySetInnerHTML={{ __html: first.iconHtml }}
+          />
+        )}
+        {first.title}
+      </a>
+      {rest.length > 0 && (
+        <span class="post-collection-more-wrap">
+          <button
+            type="button"
+            class="post-collection-more"
+            data-collection-popover-trigger
+          >
+            and {rest.length} more
+          </button>
+          <div class="post-collection-popover" data-collection-popover>
+            {collections.map((c) => (
+              <a
+                key={c.slug}
+                href={`/c/${c.slug}`}
+                class="post-collection-popover-item"
+              >
+                {c.iconHtml && (
+                  <span
+                    class="post-collection-icon"
+                    dangerouslySetInnerHTML={{ __html: c.iconHtml }}
+                  />
+                )}
+                {c.title}
+              </a>
+            ))}
+          </div>
+        </span>
+      )}
+    </span>
+  );
+};
+
+export const PostFooter: FC<PostFooterProps> = ({ post, detail, display }) => {
+  const { t } = useLingui();
+  const safeExternalUrl =
+    post.format === "link" && post.url ? sanitizeUrl(post.url) : "";
+
+  return (
+    <footer
+      class={`post-menu-footer${detail ? " post-footer-detail" : ""}`}
+      data-post-meta
+    >
+      <div class="post-footer-meta">
+        {detail ? (
+          <time
+            class="dt-published"
+            datetime={post.publishedAt}
+            title={`${post.publishedAtFormatted} ${post.publishedAtTime} UTC`}
+          >
+            {post.publishedAtFormatted}
+          </time>
+        ) : (
+          <a
+            href={post.permalink}
+            class="u-url text-xs text-muted-foreground hover:underline"
+          >
+            <time
+              class="dt-published"
+              datetime={post.publishedAt}
+              title={`${post.publishedAtFormatted} ${post.publishedAtTime} UTC`}
+            >
+              {post.publishedAtFormatted}
+            </time>
+          </a>
+        )}
+        {safeExternalUrl && (
+          <a
+            href={safeExternalUrl}
+            class="post-footer-external-link"
+            target="_blank"
+            rel="noopener noreferrer"
+            aria-label="Open external link"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+            >
+              <path d="M7 17 17 7" />
+              <path d="M9 7h8v8" />
+            </svg>
+          </a>
+        )}
+        {detail && (
+          <a href={post.permalink} class="u-url ml-4">
+            {t({
+              message: "Permalink",
+              comment: "@context: Link to permanent URL of post",
+            })}
+          </a>
+        )}
+        {post.threadRootPermalink && (
+          <span class="post-collection-sep" aria-hidden="true">
+            &middot;
+          </span>
+        )}
+        {post.threadRootPermalink && (
+          <a
+            href={post.threadRootPermalink}
+            class="text-xs text-muted-foreground hover:underline"
+          >
+            In thread &rarr;
+          </a>
+        )}
+        <CollectionTags collections={post.collections} />
+      </div>
+      {!display?.hideActions && (
+        <div class="post-menu-actions">
+          {post.isLastInThread && (
+            <button
+              type="button"
+              class="reply-trigger"
+              aria-label="Reply"
+              data-reply-trigger
+            >
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="14"
+                height="14"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <polyline points="9 17 4 12 9 7" />
+                <path d="M20 18v-2a4 4 0 0 0-4-4H4" />
+              </svg>
+            </button>
+          )}
+          <button
+            type="button"
+            class="post-menu-trigger"
+            aria-label="More actions"
+            data-post-menu-trigger
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="16"
+              height="16"
+              viewBox="0 0 24 24"
+              fill="currentColor"
+            >
+              <circle cx="5" cy="12" r="2" />
+              <circle cx="12" cy="12" r="2" />
+              <circle cx="19" cy="12" r="2" />
+            </svg>
+          </button>
+        </div>
+      )}
+    </footer>
+  );
+};

package/src/ui/shared/StarRating.tsx

@@ -0,0 +1,27 @@
+/**
+ * Star Rating (read-only)
+ *
+ * Displays a 1-5 star rating inline. Returns null when no rating is set.
+ */
+
+import type { FC } from "hono/jsx";
+
+interface StarRatingProps {
+  rating?: number;
+}
+
+export const StarRating: FC<StarRatingProps> = ({ rating }) => {
+  if (!rating || rating <= 0) return null;
+
+  const stars = [1, 2, 3, 4, 5];
+
+  return (
+    <div class="post-rating" aria-label={`${rating} out of 5`}>
+      {stars.map((n) => (
+        <span class={n <= rating ? "post-star-filled" : "post-star-empty"}>
+          ★
+        </span>
+      ))}
+    </div>
+  );
+};

package/src/ui/shared/__tests__/format-chars.test.ts

@@ -0,0 +1,35 @@
+import { describe, it, expect } from "vitest";
+import { formatChars } from "../MediaGallery.js";
+
+describe("formatChars", () => {
+  it("shows raw count below 1000", () => {
+    expect(formatChars(0)).toBe("0 chars");
+    expect(formatChars(1)).toBe("1 chars");
+    expect(formatChars(500)).toBe("500 chars");
+    expect(formatChars(999)).toBe("999 chars");
+  });
+
+  it("formats thousands without trailing .0", () => {
+    expect(formatChars(1000)).toBe("1k chars");
+    expect(formatChars(4000)).toBe("4k chars");
+    expect(formatChars(4023)).toBe("4k chars");
+    expect(formatChars(10000)).toBe("10k chars");
+    expect(formatChars(100000)).toBe("100k chars");
+  });
+
+  it("keeps meaningful decimal in thousands", () => {
+    expect(formatChars(1500)).toBe("1.5k chars");
+    expect(formatChars(4500)).toBe("4.5k chars");
+    expect(formatChars(12300)).toBe("12.3k chars");
+  });
+
+  it("formats millions without trailing .0", () => {
+    expect(formatChars(1000000)).toBe("1M chars");
+    expect(formatChars(2000000)).toBe("2M chars");
+  });
+
+  it("keeps meaningful decimal in millions", () => {
+    expect(formatChars(1500000)).toBe("1.5M chars");
+    expect(formatChars(2300000)).toBe("2.3M chars");
+  });
+});

package/src/ui/shared/index.ts

@@ -9,4 +9,3 @@ export {
   type PagePaginationProps,
 } from "./Pagination.js";
 export { getPageNumbers } from "../../lib/pagination.js";
-export { ThreadView, type ThreadViewProps } from "./ThreadView.js";

package/src/db/migrations/0000_square_wallflower.sql

@@ -1,118 +0,0 @@
-CREATE TABLE `account` (
-	`id` text PRIMARY KEY NOT NULL,
-	`account_id` text NOT NULL,
-	`provider_id` text NOT NULL,
-	`user_id` text NOT NULL,
-	`access_token` text,
-	`refresh_token` text,
-	`id_token` text,
-	`access_token_expires_at` integer,
-	`refresh_token_expires_at` integer,
-	`scope` text,
-	`password` text,
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL,
-	FOREIGN KEY (`user_id`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
-);
---> statement-breakpoint
-CREATE TABLE `collections` (
-	`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
-	`path` text,
-	`title` text NOT NULL,
-	`description` text,
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL
-);
---> statement-breakpoint
-CREATE UNIQUE INDEX `collections_path_unique` ON `collections` (`path`);--> statement-breakpoint
-CREATE TABLE `media` (
-	`id` text PRIMARY KEY NOT NULL,
-	`post_id` integer,
-	`filename` text NOT NULL,
-	`original_name` text NOT NULL,
-	`mime_type` text NOT NULL,
-	`size` integer NOT NULL,
-	`r2_key` text NOT NULL,
-	`width` integer,
-	`height` integer,
-	`alt` text,
-	`created_at` integer NOT NULL,
-	FOREIGN KEY (`post_id`) REFERENCES `posts`(`id`) ON UPDATE no action ON DELETE no action
-);
---> statement-breakpoint
-CREATE TABLE `post_collections` (
-	`post_id` integer NOT NULL,
-	`collection_id` integer NOT NULL,
-	`added_at` integer NOT NULL,
-	PRIMARY KEY(`post_id`, `collection_id`),
-	FOREIGN KEY (`post_id`) REFERENCES `posts`(`id`) ON UPDATE no action ON DELETE no action,
-	FOREIGN KEY (`collection_id`) REFERENCES `collections`(`id`) ON UPDATE no action ON DELETE no action
-);
---> statement-breakpoint
-CREATE TABLE `posts` (
-	`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
-	`type` text NOT NULL,
-	`visibility` text DEFAULT 'quiet' NOT NULL,
-	`title` text,
-	`path` text,
-	`content` text,
-	`content_html` text,
-	`source_url` text,
-	`source_name` text,
-	`source_domain` text,
-	`reply_to_id` integer,
-	`thread_id` integer,
-	`deleted_at` integer,
-	`published_at` integer NOT NULL,
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL
-);
---> statement-breakpoint
-CREATE TABLE `redirects` (
-	`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
-	`from_path` text NOT NULL,
-	`to_path` text NOT NULL,
-	`type` integer DEFAULT 301 NOT NULL,
-	`created_at` integer NOT NULL
-);
---> statement-breakpoint
-CREATE UNIQUE INDEX `redirects_from_path_unique` ON `redirects` (`from_path`);--> statement-breakpoint
-CREATE TABLE `session` (
-	`id` text PRIMARY KEY NOT NULL,
-	`expires_at` integer NOT NULL,
-	`token` text NOT NULL,
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL,
-	`ip_address` text,
-	`user_agent` text,
-	`user_id` text NOT NULL,
-	FOREIGN KEY (`user_id`) REFERENCES `user`(`id`) ON UPDATE no action ON DELETE no action
-);
---> statement-breakpoint
-CREATE UNIQUE INDEX `session_token_unique` ON `session` (`token`);--> statement-breakpoint
-CREATE TABLE `settings` (
-	`key` text PRIMARY KEY NOT NULL,
-	`value` text NOT NULL,
-	`updated_at` integer NOT NULL
-);
---> statement-breakpoint
-CREATE TABLE `user` (
-	`id` text PRIMARY KEY NOT NULL,
-	`name` text NOT NULL,
-	`email` text NOT NULL,
-	`email_verified` integer DEFAULT false NOT NULL,
-	`image` text,
-	`role` text DEFAULT 'admin',
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL
-);
---> statement-breakpoint
-CREATE UNIQUE INDEX `user_email_unique` ON `user` (`email`);--> statement-breakpoint
-CREATE TABLE `verification` (
-	`id` text PRIMARY KEY NOT NULL,
-	`identifier` text NOT NULL,
-	`value` text NOT NULL,
-	`expires_at` integer NOT NULL,
-	`created_at` integer,
-	`updated_at` integer
-);

package/src/db/migrations/0001_add_search_fts.sql

@@ -1,34 +0,0 @@
--- FTS5 virtual table for full-text search (trigram tokenizer for CJK support)
-CREATE VIRTUAL TABLE IF NOT EXISTS posts_fts USING fts5(
-  title,
-  content,
-  content='posts',
-  content_rowid='id',
-  tokenize='trigram'
-);
-
--- Populate FTS with existing posts
-INSERT INTO posts_fts(rowid, title, content)
-SELECT id, COALESCE(title, ''), COALESCE(content, '')
-FROM posts WHERE deleted_at IS NULL;
-
--- Trigger: sync FTS on INSERT
-CREATE TRIGGER posts_fts_insert AFTER INSERT ON posts
-WHEN NEW.deleted_at IS NULL
-BEGIN
-  INSERT INTO posts_fts(rowid, title, content)
-  VALUES (NEW.id, COALESCE(NEW.title, ''), COALESCE(NEW.content, ''));
-END;
-
--- Trigger: sync FTS on UPDATE
-CREATE TRIGGER posts_fts_update AFTER UPDATE ON posts BEGIN
-  DELETE FROM posts_fts WHERE rowid = OLD.id;
-  INSERT INTO posts_fts(rowid, title, content)
-  SELECT NEW.id, COALESCE(NEW.title, ''), COALESCE(NEW.content, '')
-  WHERE NEW.deleted_at IS NULL;
-END;
-
--- Trigger: sync FTS on DELETE
-CREATE TRIGGER posts_fts_delete AFTER DELETE ON posts BEGIN
-  DELETE FROM posts_fts WHERE rowid = OLD.id;
-END;

package/src/db/migrations/0002_add_media_attachments.sql

@@ -1,3 +0,0 @@
-ALTER TABLE `media` ADD COLUMN `position` integer NOT NULL DEFAULT 0;
---> statement-breakpoint
-ALTER TABLE `media` ADD COLUMN `blurhash` text;

package/src/db/migrations/0003_add_navigation_links.sql

@@ -1,8 +0,0 @@
-CREATE TABLE `navigation_links` (
-	`id` integer PRIMARY KEY AUTOINCREMENT NOT NULL,
-	`label` text NOT NULL,
-	`url` text NOT NULL,
-	`position` integer DEFAULT 0 NOT NULL,
-	`created_at` integer NOT NULL,
-	`updated_at` integer NOT NULL
-);

package/src/db/migrations/0004_add_storage_provider.sql

@@ -1,3 +0,0 @@
-ALTER TABLE `media` ADD COLUMN `provider` text NOT NULL DEFAULT 'r2';
---> statement-breakpoint
-ALTER TABLE `media` RENAME COLUMN `r2_key` TO `storage_key`;