Use URLs with trailing slash for locations in workspace packages

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "deno.enable": true
+}

www/components/api.tsx

@@ -49,12 +49,12 @@ interface TypeProps {
   node: RenderableDocNode;
 }
 
-function* Type({ node }: TypeProps): Operation<JSXElement> {
+export function* Type({ node }: TypeProps): Operation<JSXElement> {
   switch (node.kind) {
     case "function":
       return (
         <header>
-          <h3 class="inline-block" style="text-wrap: nowrap;">
+          <h3 class="inline-block">
             <span class="language-ts code-highlight">
               {node.functionDef.isAsync
                 ? <Punctuation>{"async "}</Punctuation>
@@ -75,8 +75,7 @@ function* Type({ node }: TypeProps): Operation<JSXElement> {
     case "class":
       return (
         <header class="mb-10">
-          {/** TODO(taras): figure out why text-nowrap is missing **/}
-          <h3 class="inline-block mb-0" style="text-wrap: nowrap;">
+          <h3 class="inline-block mb-0">
             <Keyword>{node.kind}</Keyword> <ClassName>{node.name}</ClassName>
             {node.classDef.extends
               ? (
@@ -100,7 +99,7 @@ function* Type({ node }: TypeProps): Operation<JSXElement> {
                 </>
               )
               : <></>}
-            <Punctuation classes="text-lg" style="text-wrap: nowrap;">
+            <Punctuation classes="text-lg">
               {" {"}
             </Punctuation>
           </h3>
@@ -111,8 +110,7 @@ function* Type({ node }: TypeProps): Operation<JSXElement> {
     case "interface":
       return (
         <header class="mb-10">
-          {/** TODO(taras): figure out why text-nowrap is missing **/}
-          <h3 class="inline-block mb-0" style="text-wrap: nowrap;">
+          <h3 class="inline-block mb-0">
             <Keyword>{node.kind}</Keyword> <ClassName>{node.name}</ClassName>
             {node.interfaceDef.typeParams.length > 0
               ? (
@@ -135,7 +133,7 @@ function* Type({ node }: TypeProps): Operation<JSXElement> {
                 </>
               )
               : <></>}
-            <Punctuation classes="text-lg" style="text-wrap: nowrap;">
+            <Punctuation classes="text-lg">
               {" {"}
             </Punctuation>
           </h3>
@@ -358,6 +356,8 @@ function TypeDef({ typeDef }: { typeDef: TsTypeDef }) {
           <Punctuation>]</Punctuation>
         </>
       );
+    case "tuple":
+      return <span class="token">[]</span>;
     case "array":
       return (
         <>
@@ -417,11 +417,20 @@ function InterfaceTypeParams({
             return [
               <>
                 {param.name}
+                <Keyword>{" extends "}</Keyword>
                 {param.constraint
                   ? <TypeDef typeDef={param.constraint} />
                   : <></>}
+                {param.default
+                  ? (
+                    <>
+                      <Keyword>{" = "}</Keyword>
+                      <TypeDef typeDef={param.default} />
+                    </>
+                  )
+                  : <></>}
               </>,
-              <>,</>,
+              ", ",
             ];
           })
           .slice(0, -1)}

www/components/index/item.tsx

@@ -14,7 +14,7 @@ export function PackageIndexItem(props: PackageIndexItemProps) {
           <a href={`/${pkg.workspace}`}>{pkg.workspace}</a>
         </h3>
         <p>
-          <pkg.MDXDescription />
+          {yield* pkg.description()}
         </p>
       </li>
     );

www/components/package/header.tsx

@@ -13,7 +13,9 @@ export function PackageHeader() {
             <span>/</span>
             {pkg.name}
           </span>
-          <span class="text-3xl mx-2 align-middle">v{pkg.version}</span>
+          <span class="text-3xl mx-2 align-middle">
+            v{pkg.version ? pkg.version : ""}
+          </span>
           {yield* PackageSourceLink()()}
         </div>
         <div class="space-x-1">

www/components/package/source-link.tsx

@@ -1,20 +1,21 @@
 import { IconExternal } from "effection-www/components/icons/external.tsx";
 import { IconGithub } from "effection-www/components/icons/github.tsx";
 
-import { REPOSITORY_NAME } from "../../config.ts";
 import { usePackage } from "../../hooks/use-package.tsx";
+import { useRepository } from "../../hooks/use-repository.ts";
 
 export function PackageSourceLink() {
   return function* () {
     const pkg = yield* usePackage();
+    const repository = yield* useRepository();
 
     return (
       <a
         href={pkg.source.toString()}
         class="[&>*]:inline-block rounded-full bg-gray-200 px-2 py-1"
       >
         <IconGithub />
-        <span class="px-1">{REPOSITORY_NAME}</span>
+        <span class="px-1">{repository.name}</span>
         <IconExternal />
       </a>
     );

www/hooks/read-packages.ts

@@ -2,7 +2,7 @@ import { call, type Operation } from "effection";
 import { PackageConfig, readPackageConfig } from "./use-package.tsx";
 
 export function* readPackages(
-  { excludePrivate }: { excludePrivate: boolean },
+  { excludePrivate, base }: { excludePrivate: boolean; base: URL },
 ): Operation<PackageConfig[]> {
   const root = yield* call(async () => {
     try {
@@ -15,13 +15,13 @@ export function* readPackages(
     }
   });
 
-  console.log(`Found ${JSON.stringify(root?.default.workspace)}`);
+  console.log(`Found ${root?.default.workspace.join(", ")}`);
 
   const configs: PackageConfig[] = [];
   for (let workspace of root?.default?.workspace ?? []) {
-    const config = yield* readPackageConfig(workspace);
+    const config = yield* readPackageConfig(new URL(workspace, base));
     if (excludePrivate) {
-      if (!config.private) {
+      if (!config.denoJson.private) {
         configs.push(config);
       }
     } else {

www/hooks/use-deno-doc.tsx

@@ -2,14 +2,14 @@ import { call, type Operation } from "effection";
 import {
   doc,
   type DocOptions,
-} from "https://deno.land/x/[email protected]/mod.ts";
-import type { DocNode } from "https://deno.land/x/deno_doc@0.125.0/types.d.ts";
+  type DocNode
+} from "jsr:@deno/doc@0.162.4";
 
 export function* useDenoDoc(
-  specifier: string,
+  specifiers: string[],
   docOptions: DocOptions = {},
-): Operation<Array<DocNode>> {
-  return yield* call(() => doc(specifier, docOptions));
+): Operation<Record<string, DocNode[]>> {
+  return yield* call(() => doc(specifiers, docOptions));
 }
 
 export type { DocNode };

www/hooks/use-description-parse.tsx

@@ -10,7 +10,13 @@ import remarkParse from "npm:[email protected]";
 import remarkRehype from "npm:[email protected]";
 import { trimAfterHR } from "../lib/trim-after-hr.ts";
 
-export function* useDescriptionParse(markdown: string): Operation<VFile> {
+export function* useDescription(markdown: string): Operation<string> {
+  const file = yield* useMarkdownFile(markdown);
+
+  return file.data?.meta?.description ?? "";
+}
+
+export function* useMarkdownFile(markdown: string): Operation<VFile> {
   return yield* call(() =>
     unified()
       .use(remarkParse)
@@ -19,7 +25,7 @@ export function* useDescriptionParse(markdown: string): Operation<VFile> {
       .use(trimAfterHR)
       .use(rehypeInferDescriptionMeta, {
         inferDescriptionHast: true,
-        truncateSize: 400,
+        truncateSize: 200,
       })
       .process(
         markdown,

www/hooks/use-mdx.tsx

@@ -9,11 +9,8 @@ import { removeDescriptionHR } from "../lib/remove-description-hr.ts";
 export function* useMDX(markdown: string): Operation<MDXModule> {
   return yield* call(() =>
     evaluate(markdown, {
-      // @ts-expect-error Type 'unknown' is not assignable to type 'JSXComponent'.
       jsx,
-      // @ts-expect-error Type '{ (component: JSXComponent, props: JSXComponentProps): JSXElement; (element: string, props: JSXElementProps): JSXElement; }' is not assignable to type 'Jsx'.
       jsxs,
-      // @ts-expect-error Type 'unknown' is not assignable to type 'JSXComponent'.
       jsxDEV: jsx,
       Fragment,
       remarkPlugins: [remarkGfm],

www/hooks/use-package.test.ts

@@ -0,0 +1,17 @@
+import { assertEquals } from "jsr:@std/assert";
+import { ensureTrailingSlash } from "./use-package.tsx";
+
+Deno.test("ensureTrailingSlash adds trailing slash to each URL", () => {
+  assertEquals(
+    ensureTrailingSlash(new URL("http://example.com/dir")).toString(),
+    "http://example.com/dir/",
+  );
+  assertEquals(
+    ensureTrailingSlash(new URL("http://example.com/dir/")).toString(),
+    "http://example.com/dir/",
+  );
+  assertEquals(
+    ensureTrailingSlash(new URL("http://example.com/file.json")).toString(),
+    "http://example.com/file.json",
+  );
+});