Merge branch 'main' into develop

.github/workflows/deploy.yml

@@ -2,6 +2,11 @@ name: Deploy
 on:
   push:
     branches: [main,develop]
+    paths:
+      - "**.tsx?"
+      - "static/**"
+      - "!cli.ts"
+  workflow_dispatch: 
 #  pull_request:
 #    branches: main
 

README.md

@@ -1,4 +1,5 @@
 ![logo](static/assets/img/icon-192x192.png)
+
 # Leaves
 
 [![Made with Fresh](https://fresh.deno.dev/fresh-badge.svg)](https://fresh.deno.dev)
@@ -7,6 +8,14 @@ Source code for https://leaves.deno.dev/ .
 
 [Zenn article](https://zenn.dev/chiba/articles/md-sns-deno-fresh)
 
+## Leaves CLI
+
+### Install
+
+```
+deno install -f -n s --allow-net=leaves.deno.dev https://raw.githubusercontent.com/chibat/leaves/main/cli.ts
+```
+
 ## References
 
 - https://supabase.com/docs/guides/database

cli.ts

@@ -2,33 +2,62 @@
 
 import { Input } from "https://deno.land/x/[email protected]/prompt/input.ts";
 import { Select } from "https://deno.land/x/[email protected]/prompt/select.ts";
+import {
+  clearScreen,
+  colors,
+} from "https://deno.land/x/[email protected]/ansi/mod.ts";
 
-const word = await Input.prompt("Search");
-if (!word) {
-  Deno.exit();
-}
-
+const COMMAND_OPTIONS = [{ value: -1, name: ":Back" }, {
+  value: -2,
+  name: ":Exit",
+}];
+const keys = { next: ["j", "down"], previous: ["k", "up"] };
 const API_PATH = Deno.args.at(0) === "dev"
   ? "http://localhost:8000/api/cli"
   : "https://leaves.deno.dev/api/cli";
 
-const url = new URL(`${API_PATH}/search`);
-url.searchParams.set("q", word);
+let list: Array<{ value: number; name: string }> = [];
+let searchSkip = false;
+let word = "";
 
-const res = await fetch(url);
-const options: any[] = await res.json();
-if (options.length === 0) {
-  console.log("Not Found");
-  Deno.exit();
-}
+while (true) {
+  console.log(clearScreen);
+  if (!searchSkip) {
+    word = await Input.prompt({ message: "Search", suggestions: [word] });
+    if (!word) {
+      Deno.exit();
+    }
+    const url = new URL(`${API_PATH}/search`);
+    url.searchParams.set("q", word);
+    const res = await fetch(url);
+    list = await res.json() as Array<{ name: string; value: number }>;
+    if (list.length === 0) {
+      console.log("Not Found");
+      Deno.exit();
+    }
+    if (list.length >= 10) {
+      console.log(
+        colors.bold.yellow(
+          "More than 10 posts hits were found. Let's add search words!",
+        ),
+      );
+    }
+  }
+
+  const postId: any = await Select.prompt({ // 型推論がおかしい
+    message: "Select",
+    maxRows: 12,
+    options: list.concat(COMMAND_OPTIONS),
+    keys,
+  });
 
-const postId = await Select.prompt({
-  message: "Select",
-  options,
-  keys: { next: ["j"], previous: ["k"] },
-});
+  if (postId === -1) {
+    searchSkip = false;
+    continue;
+  } else if (postId === -2) {
+    Deno.exit(0);
+  }
 
-{
   const res = await fetch(`${API_PATH}/posts/${postId}`);
   const json = await res.json();
   console.log(
@@ -39,4 +68,14 @@ const postId = await Select.prompt({
     "---------------------------------------------------------------------------------",
   );
   console.log(`https://leaves.deno.dev/posts/${postId}`);
+  const option: any = await Select.prompt({
+    message: "Select",
+    options: COMMAND_OPTIONS,
+    keys,
+  });
+  if (option === -2) {
+    Deno.exit(0);
+  } else if (option === -1) {
+    searchSkip = true;
+  }
 }

routes/api/cli/search.ts

@@ -13,7 +13,7 @@ export default defineRoute(async (req, _ctx) => {
     loginUserId: null,
   });
   const body = rows.map((row) => {
-    return { value: row.id, name: getTitle(row.source) };
+    return { value: row.id, name: "* " + getTitle(row.source) };
   });
   return Response.json(body);
 });

routes/search.tsx

@@ -40,7 +40,7 @@ export default defineRoute(async (req, ctx) => {
             name="value"
             value={searchParams}
             placeholder="Input search words"
-            autoFocus
+            autoFocus={!searchParams}
           />
         </form>
         {searchParams &&

server/markdown.ts

@@ -58,6 +58,15 @@ class Renderer extends Marked.Renderer {
         return youtubeTag;
       }
     }
+    if (text === "_preview_large") {
+      return `<iframe src="https://ogp.deno.dev/?size=large&url=${
+        encodeURIComponent(href)
+      }" height="350" width="500"></iframe>`;
+    } else if (text === "_preview_small") {
+      return `<iframe src="https://ogp.deno.dev/?size=small&url=${
+        encodeURIComponent(href)
+      }" height="150" style="width: 100%;"></iframe>`;
+    }
     return `<a href="${href}" title="${title}" rel="noopener noreferrer" target="_blank">${text}</a>`;
   }
 }
@@ -150,6 +159,7 @@ export function render(markdown: string, opts: RenderOptions = {}): string {
   }
 
   return sanitizeHtml(html, {
+    allowedIframeDomains: ["youtu.be", "www.youtube.com", "ogp.deno.dev"],
     transformTags: {
       img: transformMedia,
       video: transformMedia,

static/app.css

@@ -89,3 +89,7 @@ iframe {
 	margin-bottom: 0;
 }
 
+.post h1, h2 {
+	margin-bottom: 16px;
+}
+