@igstack/app-catalog-frontend-core 6.1.0-alpha-20260924231444 → 6.1.0

package/dist/esm/modules/appCatalog/ui/components/SubResourcesSection.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useSearch, useNavigate, Link } from "@tanstack/react-router";
-import { X, Search } from "lucide-react";
-import { useMemo, useState, useEffect, useRef } from "react";
+import { useSearch, Link } from "@tanstack/react-router";
+import { Search } from "lucide-react";
+import { useMemo, useState, useEffect } from "react";
 import { Badge } from "../../../../ui/badge.js";
 import { Input } from "../../../../ui/input.js";
 import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "../../../../ui/table.js";
@@ -41,27 +41,6 @@ function SubResourcesSection({
     () => subResources.find((sr) => sr.slug === selectedSubSlug) ?? null,
     [subResources, selectedSubSlug]
   );
-  const navigate = useNavigate();
-  const [highlightSlug, setHighlightSlug] = useState(selectedSubSlug);
-  useEffect(() => {
-    if (selectedSubSlug) setHighlightSlug(selectedSubSlug);
-  }, [selectedSubSlug]);
-  const searchInputRef = useRef(null);
-  const focusSearchAfterClear = useRef(false);
-  useEffect(() => {
-    var _a;
-    if (!selectedSub && focusSearchAfterClear.current) {
-      focusSearchAfterClear.current = false;
-      (_a = searchInputRef.current) == null ? void 0 : _a.focus();
-    }
-  }, [selectedSub]);
-  const clearSelection = () => {
-    focusSearchAfterClear.current = true;
-    void navigate({
-      to: ".",
-      search: (prev) => ({ ...prev, sub: void 0 })
-    });
-  };
   const seededSearch = useMemo(() => {
     const q = initialSearch == null ? void 0 : initialSearch.trim().toLowerCase();
     if (!q) return "";
@@ -107,29 +86,11 @@ function SubResourcesSection({
       ")"
     ] }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-      selectedSub ? (
-        // `?sub=` wins over the search box, so show it where the box would be
-        // and make it dismissible — otherwise the only way out is the URL.
-        /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center", children: /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "h-9 gap-1 pl-3 pr-1 text-sm", children: [
-          "Showing: ",
-          selectedSub.displayName,
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              "aria-label": "Clear sub-resource filter",
-              onClick: clearSelection,
-              className: "rounded-sm p-1 hover:bg-muted-foreground/20",
-              children: /* @__PURE__ */ jsx(X, { className: "size-4" })
-            }
-          )
-        ] }) })
-      ) : /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative flex-1", children: [
         /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-2.5 size-4 text-muted-foreground" }),
         /* @__PURE__ */ jsx(
           Input,
           {
-            ref: searchInputRef,
             placeholder: "Search resources by name or alias...",
             value: search,
             onChange: (e) => setSearch(e.target.value),
@@ -165,8 +126,8 @@ function SubResourcesSection({
         return /* @__PURE__ */ jsxs(
           TableRow,
           {
-            "aria-current": sr.slug === highlightSlug ? "true" : void 0,
-            className: sr.slug === highlightSlug ? "bg-primary/[0.06]" : "",
+            "aria-current": sr.slug === selectedSubSlug ? "true" : void 0,
+            className: sr.slug === selectedSubSlug ? "bg-primary/[0.06]" : "",
             children: [
               /* @__PURE__ */ jsxs(TableCell, { children: [
                 /* @__PURE__ */ jsx(

package/dist/esm/modules/appCatalog/ui/components/SubResourcesSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubResourcesSection.js","sources":["../../../../../../src/modules/appCatalog/ui/components/SubResourcesSection.tsx"],"sourcesContent":["import type { Resource } from '@igstack/app-catalog-backend-core'\nimport { Link, useNavigate, useSearch } from '@tanstack/react-router'\nimport { Search, X } from 'lucide-react'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport { Badge } from '~/ui/badge'\nimport { Input } from '~/ui/input'\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from '~/ui/table'\nimport { PersonBadge, PersonOrGroupBadge } from './PersonBadge'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '~/ui/select'\nimport { markdownToPlainText } from '~/modules/appCatalog/utils/markdownToPlainText'\n\ninterface SubResourcesSectionProps {\n  subResources: Resource[]\n  /** Slug of the parent, for linking to a child's own page. */\n  parentSlug: string\n  /**\n   * Initial filter text (#38 item C). When the user reached this app by\n   * searching a term that matched a sub-resource, seed the sub-resource filter\n   * with that term so the matched child is revealed instead of buried in a\n   * long list (e.g. searching \"data\" → open Cloud Console → the matching\n   * account is pre-filtered). Only applied when it actually matches a child.\n   */\n  initialSearch?: string\n}\n\nfunction getTierBadgeVariant(\n  tierSlug: string,\n): 'default' | 'secondary' | 'destructive' | 'outline' {\n  if (tierSlug === 'prod' || tierSlug === 'production') return 'destructive'\n  if (tierSlug === 'dev' || tierSlug === 'staging') return 'secondary'\n  if (tierSlug === 'preprod') return 'outline'\n  if (tierSlug === 'sandbox') return 'outline'\n  return 'outline'\n}\n\nfunction getTierBadgeClassName(tierSlug: string): string {\n  if (tierSlug === 'preprod')\n    return 'border-amber-400 bg-amber-100 text-amber-800 hover:bg-amber-200'\n  if (tierSlug === 'sandbox')\n    return 'border-gray-400 bg-gray-100 text-gray-700 hover:bg-gray-200'\n  return ''\n}\n\nfunction getTierDisplayLabel(tierSlug: string): string {\n  if (tierSlug === 'preprod') return 'Pre-Prod'\n  if (tierSlug === 'sandbox') return 'Sandbox'\n  if (tierSlug === 'prod' || tierSlug === 'production') return 'Prod'\n  if (tierSlug === 'dev') return 'Dev'\n  if (tierSlug === 'staging') return 'Staging'\n  return tierSlug\n}\n\nexport function SubResourcesSection({\n  subResources,\n  parentSlug,\n  initialSearch,\n}: SubResourcesSectionProps) {\n  // `?sub=<slug>` — the one sub-resource the user asked for, by clicking its row\n  // in the search results. It wins over the query-seeded filter below: a query\n  // like \"project\" matches every child, so seeding with it would bury the row\n  // that was actually clicked.\n  const search_ = useSearch({ strict: false })\n  const selectedSubSlug = search_.sub\n  const selectedSub = useMemo(\n    () => subResources.find((sr) => sr.slug === selectedSubSlug) ?? null,\n    [subResources, selectedSubSlug],\n  )\n  const navigate = useNavigate()\n\n  // The row to mark as \"this one\". It outlives `?sub=` so clearing the filter\n  // brings the siblings back without losing the user's place.\n  const [highlightSlug, setHighlightSlug] = useState(selectedSubSlug)\n  useEffect(() => {\n    if (selectedSubSlug) setHighlightSlug(selectedSubSlug)\n  }, [selectedSubSlug])\n\n  // The search input only mounts once the selection is gone, so focus it then.\n  const searchInputRef = useRef<HTMLInputElement>(null)\n  const focusSearchAfterClear = useRef(false)\n  useEffect(() => {\n    if (!selectedSub && focusSearchAfterClear.current) {\n      focusSearchAfterClear.current = false\n      searchInputRef.current?.focus()\n    }\n  }, [selectedSub])\n\n  const clearSelection = () => {\n    focusSearchAfterClear.current = true\n    // A navigation, not a replace, so Back restores the single-row view.\n    void navigate({\n      to: '.',\n      search: (prev) => ({ ...prev, sub: undefined }),\n    })\n  }\n\n  // Seed the filter with the incoming query ONLY if it matches a child, so we\n  // reveal the matched sub-resource without hiding everything on a non-match.\n  const seededSearch = useMemo(() => {\n    const q = initialSearch?.trim().toLowerCase()\n    if (!q) return ''\n    const hit = subResources.some(\n      (sr) =>\n        sr.displayName.toLowerCase().includes(q) ||\n        (sr.aliases ?? []).some((a) => a.toLowerCase().includes(q)),\n    )\n    return hit ? initialSearch!.trim() : ''\n  }, [initialSearch, subResources])\n  const [search, setSearch] = useState(seededSearch)\n  const [tierFilter, setTierFilter] = useState<string>('all')\n\n  // useState only reads its argument on the first render, so without this the\n  // filter kept the query from whenever this panel first mounted — searching\n  // again with the panel already open left the old term in the box.\n  useEffect(() => setSearch(seededSearch), [seededSearch])\n\n  const uniqueTiers = useMemo(() => {\n    const tiers = new Set<string>()\n    for (const sr of subResources) {\n      if (sr.tier) tiers.add(sr.tier)\n    }\n    return [...tiers].sort()\n  }, [subResources])\n\n  const filtered = useMemo(() => {\n    if (selectedSub) return [selectedSub]\n\n    let result = subResources\n\n    if (tierFilter !== 'all') {\n      result = result.filter((sr) => sr.tier === tierFilter)\n    }\n\n    if (search.trim()) {\n      const q = search.trim().toLowerCase()\n      result = result.filter(\n        (sr) =>\n          sr.displayName.toLowerCase().includes(q) ||\n          (sr.aliases ?? []).some((a) => a.toLowerCase().includes(q)) ||\n          (sr.description?.toLowerCase().includes(q) ?? false) ||\n          (\n            (sr.extra as Record<string, unknown>).awsAccountId as\n              | string\n              | undefined\n          )?.includes(q) === true,\n      )\n    }\n\n    return result\n  }, [subResources, search, tierFilter, selectedSub])\n\n  if (subResources.length === 0) return null\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"text-sm font-medium\">\n          Sub-Resources ({filtered.length} of {subResources.length})\n        </div>\n      </div>\n\n      {/* Filters */}\n      <div className=\"flex gap-2\">\n        {selectedSub ? (\n          // `?sub=` wins over the search box, so show it where the box would be\n          // and make it dismissible — otherwise the only way out is the URL.\n          <div className=\"flex flex-1 items-center\">\n            <Badge variant=\"secondary\" className=\"h-9 gap-1 pl-3 pr-1 text-sm\">\n              Showing: {selectedSub.displayName}\n              <button\n                type=\"button\"\n                aria-label=\"Clear sub-resource filter\"\n                onClick={clearSelection}\n                className=\"rounded-sm p-1 hover:bg-muted-foreground/20\"\n              >\n                <X className=\"size-4\" />\n              </button>\n            </Badge>\n          </div>\n        ) : (\n          <div className=\"relative flex-1\">\n            <Search className=\"absolute left-2.5 top-2.5 size-4 text-muted-foreground\" />\n            <Input\n              ref={searchInputRef}\n              placeholder=\"Search resources by name or alias...\"\n              value={search}\n              onChange={(e) => setSearch(e.target.value)}\n              className=\"pl-9 h-9\"\n            />\n          </div>\n        )}\n        {uniqueTiers.length > 1 && (\n          <Select value={tierFilter} onValueChange={setTierFilter}>\n            <SelectTrigger className=\"w-[130px] h-9\">\n              <SelectValue placeholder=\"All tiers\" />\n            </SelectTrigger>\n            <SelectContent>\n              <SelectItem value=\"all\">All tiers</SelectItem>\n              {uniqueTiers.map((tier) => (\n                <SelectItem key={tier} value={tier}>\n                  {tier}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n        )}\n      </div>\n\n      {/* Table */}\n      <div className=\"rounded-lg border max-h-[400px] overflow-auto\">\n        <Table>\n          <TableHeader>\n            <TableRow>\n              <TableHead>Name</TableHead>\n              <TableHead className=\"w-[80px]\">Tier</TableHead>\n              <TableHead>Owner</TableHead>\n              <TableHead>Approvers</TableHead>\n              <TableHead className=\"w-[140px]\">AWS Account</TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            {filtered.length === 0 ? (\n              <TableRow>\n                <TableCell\n                  colSpan={5}\n                  className=\"text-center text-muted-foreground py-8\"\n                >\n                  No resources match your filters\n                </TableCell>\n              </TableRow>\n            ) : (\n              filtered.map((sr) => {\n                // Approvers are Person OR Group slugs; the badge resolves both.\n                const approvers = [...new Set(sr.approverSlugs ?? [])]\n\n                return (\n                  <TableRow\n                    key={sr.slug}\n                    // The row the user asked for, so it reads as \"this one\" even\n                    // once the filter is cleared and its siblings come back.\n                    aria-current={\n                      sr.slug === highlightSlug ? 'true' : undefined\n                    }\n                    className={\n                      sr.slug === highlightSlug ? 'bg-primary/[0.06]' : ''\n                    }\n                  >\n                    <TableCell>\n                      {/* A real link, not a click handler on the row: this is a\n                          table of resources, each of which has its own page. */}\n                      <Link\n                        to=\"/app/$slug/sub/$subSlug\"\n                        params={{ slug: parentSlug, subSlug: sr.slug }}\n                        className=\"font-medium text-sm hover:text-primary hover:underline\"\n                      >\n                        {sr.displayName}\n                      </Link>\n                      {(sr.aliases ?? []).length > 0 && (\n                        <div className=\"text-xs text-muted-foreground mt-0.5\">\n                          {(sr.aliases ?? []).join(', ')}\n                        </div>\n                      )}\n                      {sr.description && (\n                        <div className=\"text-xs text-muted-foreground mt-0.5\">\n                          {markdownToPlainText(sr.description)}\n                        </div>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {sr.tier && (\n                        <Badge\n                          variant={getTierBadgeVariant(sr.tier)}\n                          className={`text-xs ${getTierBadgeClassName(sr.tier)}`}\n                        >\n                          {getTierDisplayLabel(sr.tier)}\n                        </Badge>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {sr.ownerPersonSlug && (\n                        <PersonBadge slug={sr.ownerPersonSlug} />\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {approvers.length > 0 ? (\n                        <div className=\"flex flex-wrap gap-1\">\n                          {approvers.map((slug) => (\n                            <PersonOrGroupBadge key={slug} slug={slug} />\n                          ))}\n                        </div>\n                      ) : (\n                        <span className=\"text-muted-foreground\">-</span>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {(() => {\n                        const accountId = (\n                          sr.extra as Record<string, unknown> | null | undefined\n                        )?.awsAccountId as string | undefined\n                        if (!accountId)\n                          return (\n                            <span className=\"text-muted-foreground\">—</span>\n                          )\n                        // The account id is what people copy; when the resource\n                        // also carries its own `appUrl` that is the console\n                        // deep link for THAT account, so the id doubles as the\n                        // launch affordance.\n                        return sr.appUrl ? (\n                          <a\n                            href={sr.appUrl}\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            className=\"font-mono text-xs text-muted-foreground hover:text-primary hover:underline select-text\"\n                          >\n                            {accountId}\n                          </a>\n                        ) : (\n                          <span className=\"font-mono text-xs text-muted-foreground select-text\">\n                            {accountId}\n                          </span>\n                        )\n                      })()}\n                    </TableCell>\n                  </TableRow>\n                )\n              })\n            )}\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SubResourcesSection.js","sources":["../../../../../../src/modules/appCatalog/ui/components/SubResourcesSection.tsx"],"sourcesContent":["import type { Resource } from '@igstack/app-catalog-backend-core'\nimport { Link, useSearch } from '@tanstack/react-router'\nimport { Search } from 'lucide-react'\nimport { useEffect, useMemo, useState } from 'react'\nimport { Badge } from '~/ui/badge'\nimport { Input } from '~/ui/input'\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from '~/ui/table'\nimport { PersonBadge, PersonOrGroupBadge } from './PersonBadge'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '~/ui/select'\nimport { markdownToPlainText } from '~/modules/appCatalog/utils/markdownToPlainText'\n\ninterface SubResourcesSectionProps {\n  subResources: Resource[]\n  /** Slug of the parent, for linking to a child's own page. */\n  parentSlug: string\n  /**\n   * Initial filter text (#38 item C). When the user reached this app by\n   * searching a term that matched a sub-resource, seed the sub-resource filter\n   * with that term so the matched child is revealed instead of buried in a\n   * long list (e.g. searching \"data\" → open Cloud Console → the matching\n   * account is pre-filtered). Only applied when it actually matches a child.\n   */\n  initialSearch?: string\n}\n\nfunction getTierBadgeVariant(\n  tierSlug: string,\n): 'default' | 'secondary' | 'destructive' | 'outline' {\n  if (tierSlug === 'prod' || tierSlug === 'production') return 'destructive'\n  if (tierSlug === 'dev' || tierSlug === 'staging') return 'secondary'\n  if (tierSlug === 'preprod') return 'outline'\n  if (tierSlug === 'sandbox') return 'outline'\n  return 'outline'\n}\n\nfunction getTierBadgeClassName(tierSlug: string): string {\n  if (tierSlug === 'preprod')\n    return 'border-amber-400 bg-amber-100 text-amber-800 hover:bg-amber-200'\n  if (tierSlug === 'sandbox')\n    return 'border-gray-400 bg-gray-100 text-gray-700 hover:bg-gray-200'\n  return ''\n}\n\nfunction getTierDisplayLabel(tierSlug: string): string {\n  if (tierSlug === 'preprod') return 'Pre-Prod'\n  if (tierSlug === 'sandbox') return 'Sandbox'\n  if (tierSlug === 'prod' || tierSlug === 'production') return 'Prod'\n  if (tierSlug === 'dev') return 'Dev'\n  if (tierSlug === 'staging') return 'Staging'\n  return tierSlug\n}\n\nexport function SubResourcesSection({\n  subResources,\n  parentSlug,\n  initialSearch,\n}: SubResourcesSectionProps) {\n  // `?sub=<slug>` — the one sub-resource the user asked for, by clicking its row\n  // in the search results. It wins over the query-seeded filter below: a query\n  // like \"project\" matches every child, so seeding with it would bury the row\n  // that was actually clicked.\n  const search_ = useSearch({ strict: false })\n  const selectedSubSlug = search_.sub\n  const selectedSub = useMemo(\n    () => subResources.find((sr) => sr.slug === selectedSubSlug) ?? null,\n    [subResources, selectedSubSlug],\n  )\n\n  // Seed the filter with the incoming query ONLY if it matches a child, so we\n  // reveal the matched sub-resource without hiding everything on a non-match.\n  const seededSearch = useMemo(() => {\n    const q = initialSearch?.trim().toLowerCase()\n    if (!q) return ''\n    const hit = subResources.some(\n      (sr) =>\n        sr.displayName.toLowerCase().includes(q) ||\n        (sr.aliases ?? []).some((a) => a.toLowerCase().includes(q)),\n    )\n    return hit ? initialSearch!.trim() : ''\n  }, [initialSearch, subResources])\n  const [search, setSearch] = useState(seededSearch)\n  const [tierFilter, setTierFilter] = useState<string>('all')\n\n  // useState only reads its argument on the first render, so without this the\n  // filter kept the query from whenever this panel first mounted — searching\n  // again with the panel already open left the old term in the box.\n  useEffect(() => setSearch(seededSearch), [seededSearch])\n\n  const uniqueTiers = useMemo(() => {\n    const tiers = new Set<string>()\n    for (const sr of subResources) {\n      if (sr.tier) tiers.add(sr.tier)\n    }\n    return [...tiers].sort()\n  }, [subResources])\n\n  const filtered = useMemo(() => {\n    if (selectedSub) return [selectedSub]\n\n    let result = subResources\n\n    if (tierFilter !== 'all') {\n      result = result.filter((sr) => sr.tier === tierFilter)\n    }\n\n    if (search.trim()) {\n      const q = search.trim().toLowerCase()\n      result = result.filter(\n        (sr) =>\n          sr.displayName.toLowerCase().includes(q) ||\n          (sr.aliases ?? []).some((a) => a.toLowerCase().includes(q)) ||\n          (sr.description?.toLowerCase().includes(q) ?? false) ||\n          (\n            (sr.extra as Record<string, unknown>).awsAccountId as\n              | string\n              | undefined\n          )?.includes(q) === true,\n      )\n    }\n\n    return result\n  }, [subResources, search, tierFilter, selectedSub])\n\n  if (subResources.length === 0) return null\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"text-sm font-medium\">\n          Sub-Resources ({filtered.length} of {subResources.length})\n        </div>\n      </div>\n\n      {/* Filters */}\n      <div className=\"flex gap-2\">\n        <div className=\"relative flex-1\">\n          <Search className=\"absolute left-2.5 top-2.5 size-4 text-muted-foreground\" />\n          <Input\n            placeholder=\"Search resources by name or alias...\"\n            value={search}\n            onChange={(e) => setSearch(e.target.value)}\n            className=\"pl-9 h-9\"\n          />\n        </div>\n        {uniqueTiers.length > 1 && (\n          <Select value={tierFilter} onValueChange={setTierFilter}>\n            <SelectTrigger className=\"w-[130px] h-9\">\n              <SelectValue placeholder=\"All tiers\" />\n            </SelectTrigger>\n            <SelectContent>\n              <SelectItem value=\"all\">All tiers</SelectItem>\n              {uniqueTiers.map((tier) => (\n                <SelectItem key={tier} value={tier}>\n                  {tier}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n        )}\n      </div>\n\n      {/* Table */}\n      <div className=\"rounded-lg border max-h-[400px] overflow-auto\">\n        <Table>\n          <TableHeader>\n            <TableRow>\n              <TableHead>Name</TableHead>\n              <TableHead className=\"w-[80px]\">Tier</TableHead>\n              <TableHead>Owner</TableHead>\n              <TableHead>Approvers</TableHead>\n              <TableHead className=\"w-[140px]\">AWS Account</TableHead>\n            </TableRow>\n          </TableHeader>\n          <TableBody>\n            {filtered.length === 0 ? (\n              <TableRow>\n                <TableCell\n                  colSpan={5}\n                  className=\"text-center text-muted-foreground py-8\"\n                >\n                  No resources match your filters\n                </TableCell>\n              </TableRow>\n            ) : (\n              filtered.map((sr) => {\n                // Approvers are Person OR Group slugs; the badge resolves both.\n                const approvers = [...new Set(sr.approverSlugs ?? [])]\n\n                return (\n                  <TableRow\n                    key={sr.slug}\n                    // The row the user asked for, so it reads as \"this one\" even\n                    // once the filter is cleared and its siblings come back.\n                    aria-current={\n                      sr.slug === selectedSubSlug ? 'true' : undefined\n                    }\n                    className={\n                      sr.slug === selectedSubSlug ? 'bg-primary/[0.06]' : ''\n                    }\n                  >\n                    <TableCell>\n                      {/* A real link, not a click handler on the row: this is a\n                          table of resources, each of which has its own page. */}\n                      <Link\n                        to=\"/app/$slug/sub/$subSlug\"\n                        params={{ slug: parentSlug, subSlug: sr.slug }}\n                        className=\"font-medium text-sm hover:text-primary hover:underline\"\n                      >\n                        {sr.displayName}\n                      </Link>\n                      {(sr.aliases ?? []).length > 0 && (\n                        <div className=\"text-xs text-muted-foreground mt-0.5\">\n                          {(sr.aliases ?? []).join(', ')}\n                        </div>\n                      )}\n                      {sr.description && (\n                        <div className=\"text-xs text-muted-foreground mt-0.5\">\n                          {markdownToPlainText(sr.description)}\n                        </div>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {sr.tier && (\n                        <Badge\n                          variant={getTierBadgeVariant(sr.tier)}\n                          className={`text-xs ${getTierBadgeClassName(sr.tier)}`}\n                        >\n                          {getTierDisplayLabel(sr.tier)}\n                        </Badge>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {sr.ownerPersonSlug && (\n                        <PersonBadge slug={sr.ownerPersonSlug} />\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {approvers.length > 0 ? (\n                        <div className=\"flex flex-wrap gap-1\">\n                          {approvers.map((slug) => (\n                            <PersonOrGroupBadge key={slug} slug={slug} />\n                          ))}\n                        </div>\n                      ) : (\n                        <span className=\"text-muted-foreground\">-</span>\n                      )}\n                    </TableCell>\n                    <TableCell>\n                      {(() => {\n                        const accountId = (\n                          sr.extra as Record<string, unknown> | null | undefined\n                        )?.awsAccountId as string | undefined\n                        if (!accountId)\n                          return (\n                            <span className=\"text-muted-foreground\">—</span>\n                          )\n                        // The account id is what people copy; when the resource\n                        // also carries its own `appUrl` that is the console\n                        // deep link for THAT account, so the id doubles as the\n                        // launch affordance.\n                        return sr.appUrl ? (\n                          <a\n                            href={sr.appUrl}\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            className=\"font-mono text-xs text-muted-foreground hover:text-primary hover:underline select-text\"\n                          >\n                            {accountId}\n                          </a>\n                        ) : (\n                          <span className=\"font-mono text-xs text-muted-foreground select-text\">\n                            {accountId}\n                          </span>\n                        )\n                      })()}\n                    </TableCell>\n                  </TableRow>\n                )\n              })\n            )}\n          </TableBody>\n        </Table>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@igstack/app-catalog-frontend-core",
-  "version": "6.1.0-alpha-20260924231444",
+  "version": "6.1.0",
   "description": "Frontend core library for App Catalog",
   "homepage": "https://github.com/lislon/app-catalog",
   "repository": {
@@ -112,7 +112,7 @@
     "tailwindcss": "^4.1.7",
     "tiptap-markdown": "^0.8.0",
     "tslib": "^2.3.0",
-    "@igstack/app-catalog-shared-core": "6.1.0-alpha-20260924231444"
+    "@igstack/app-catalog-shared-core": "6.1.0"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.0.5",
@@ -139,7 +139,7 @@
     "vite-plugin-static-copy": "^3.1.4",
     "vite-plugin-svgr": "^4.2.0",
     "vitest": "^4.1.2",
-    "@igstack/app-catalog-backend-core": "6.1.0-alpha-20260924231444"
+    "@igstack/app-catalog-backend-core": "6.1.0"
   },
   "peerDependencies": {
     "react": "19.1.2",
@@ -148,7 +148,7 @@
     "vite": "^6.3.5",
     "vite-plugin-svgr": "^4.2.0"
   },
-  "gitHead": "c30869221db7a7c165123352ba079dcfb2c79062",
+  "gitHead": "df0fdd456ac388d853ec0e04619e4d7741bcebcb",
   "scripts": {
     "build": "vite build",
     "build:lenient": "vite build --mode lenient",

package/src/__tests__/modules/appCatalog/ui/components/SubResourcesSection.test.tsx

@@ -1,15 +1,12 @@
 import type { Resource } from '@igstack/app-catalog-backend-core'
-import { fireEvent, render, screen } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import { describe, expect, it, vi } from 'vitest'
 import '@testing-library/jest-dom/vitest'
 
 // The component reads `?sub=` and links rows to a child's own page; neither is
 // under test here, so stub the router rather than mounting one.
-const routerSearch: { sub?: string } = {}
-const navigate = vi.fn()
 vi.mock('@tanstack/react-router', () => ({
-  useSearch: vi.fn(() => routerSearch),
-  useNavigate: vi.fn(() => navigate),
+  useSearch: vi.fn(() => ({})),
   Link: ({ children, ...rest }: { children?: React.ReactNode }) => (
     <a {...rest}>{children}</a>
   ),
@@ -95,46 +92,3 @@ describe('SubResourcesSection — account id as deep link', () => {
     )
   })
 })
-
-// A `?sub=` deep link singles out one row; the table must say so and offer a
-// way back to the full list without editing the URL.
-describe('SubResourcesSection — clearing the ?sub= selection', () => {
-  const rows = [sub('a', {}), sub('b', {}), sub('c', {})]
-
-  it('shows the selection as a dismissible filter that restores every row', () => {
-    routerSearch.sub = 'b'
-    navigate.mockClear()
-    const { rerender } = render(
-      <SubResourcesSection parentSlug="p" subResources={rows} />,
-    )
-    expect(screen.getByText('Sub-Resources (1 of 3)')).toBeInTheDocument()
-
-    fireEvent.click(
-      screen.getByRole('button', { name: 'Clear sub-resource filter' }),
-    )
-    const { search } = navigate.mock.calls[0]![0] as {
-      search: (prev: object) => object
-    }
-    expect(search({ sub: 'b', q: 'x' })).toEqual({ sub: undefined, q: 'x' })
-
-    // The router drops `sub` from the URL, which re-renders the section.
-    routerSearch.sub = undefined
-    rerender(<SubResourcesSection parentSlug="p" subResources={rows} />)
-    expect(screen.getByText('Sub-Resources (3 of 3)')).toBeInTheDocument()
-    expect(
-      screen.getByPlaceholderText('Search resources by name or alias...'),
-    ).toHaveFocus()
-    // The user keeps their place: the row they came for is still marked.
-    expect(
-      screen.getByText('b', { selector: 'a' }).closest('tr'),
-    ).toHaveAttribute('aria-current', 'true')
-  })
-
-  it('shows no clear control without a selection', () => {
-    routerSearch.sub = undefined
-    render(<SubResourcesSection parentSlug="p" subResources={rows} />)
-    expect(
-      screen.queryByRole('button', { name: 'Clear sub-resource filter' }),
-    ).not.toBeInTheDocument()
-  })
-})

package/src/modules/appCatalog/ui/components/SubResourcesSection.tsx

@@ -1,7 +1,7 @@
 import type { Resource } from '@igstack/app-catalog-backend-core'
-import { Link, useNavigate, useSearch } from '@tanstack/react-router'
-import { Search, X } from 'lucide-react'
-import { useEffect, useMemo, useRef, useState } from 'react'
+import { Link, useSearch } from '@tanstack/react-router'
+import { Search } from 'lucide-react'
+import { useEffect, useMemo, useState } from 'react'
 import { Badge } from '~/ui/badge'
 import { Input } from '~/ui/input'
 import {
@@ -78,33 +78,6 @@ export function SubResourcesSection({
     () => subResources.find((sr) => sr.slug === selectedSubSlug) ?? null,
     [subResources, selectedSubSlug],
   )
-  const navigate = useNavigate()
-
-  // The row to mark as "this one". It outlives `?sub=` so clearing the filter
-  // brings the siblings back without losing the user's place.
-  const [highlightSlug, setHighlightSlug] = useState(selectedSubSlug)
-  useEffect(() => {
-    if (selectedSubSlug) setHighlightSlug(selectedSubSlug)
-  }, [selectedSubSlug])
-
-  // The search input only mounts once the selection is gone, so focus it then.
-  const searchInputRef = useRef<HTMLInputElement>(null)
-  const focusSearchAfterClear = useRef(false)
-  useEffect(() => {
-    if (!selectedSub && focusSearchAfterClear.current) {
-      focusSearchAfterClear.current = false
-      searchInputRef.current?.focus()
-    }
-  }, [selectedSub])
-
-  const clearSelection = () => {
-    focusSearchAfterClear.current = true
-    // A navigation, not a replace, so Back restores the single-row view.
-    void navigate({
-      to: '.',
-      search: (prev) => ({ ...prev, sub: undefined }),
-    })
-  }
 
   // Seed the filter with the incoming query ONLY if it matches a child, so we
   // reveal the matched sub-resource without hiding everything on a non-match.
@@ -173,34 +146,15 @@ export function SubResourcesSection({
 
       {/* Filters */}
       <div className="flex gap-2">
-        {selectedSub ? (
-          // `?sub=` wins over the search box, so show it where the box would be
-          // and make it dismissible — otherwise the only way out is the URL.
-          <div className="flex flex-1 items-center">
-            <Badge variant="secondary" className="h-9 gap-1 pl-3 pr-1 text-sm">
-              Showing: {selectedSub.displayName}
-              <button
-                type="button"
-                aria-label="Clear sub-resource filter"
-                onClick={clearSelection}
-                className="rounded-sm p-1 hover:bg-muted-foreground/20"
-              >
-                <X className="size-4" />
-              </button>
-            </Badge>
-          </div>
-        ) : (
-          <div className="relative flex-1">
-            <Search className="absolute left-2.5 top-2.5 size-4 text-muted-foreground" />
-            <Input
-              ref={searchInputRef}
-              placeholder="Search resources by name or alias..."
-              value={search}
-              onChange={(e) => setSearch(e.target.value)}
-              className="pl-9 h-9"
-            />
-          </div>
-        )}
+        <div className="relative flex-1">
+          <Search className="absolute left-2.5 top-2.5 size-4 text-muted-foreground" />
+          <Input
+            placeholder="Search resources by name or alias..."
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            className="pl-9 h-9"
+          />
+        </div>
         {uniqueTiers.length > 1 && (
           <Select value={tierFilter} onValueChange={setTierFilter}>
             <SelectTrigger className="w-[130px] h-9">
@@ -251,10 +205,10 @@ export function SubResourcesSection({
                     // The row the user asked for, so it reads as "this one" even
                     // once the filter is cleared and its siblings come back.
                     aria-current={
-                      sr.slug === highlightSlug ? 'true' : undefined
+                      sr.slug === selectedSubSlug ? 'true' : undefined
                     }
                     className={
-                      sr.slug === highlightSlug ? 'bg-primary/[0.06]' : ''
+                      sr.slug === selectedSubSlug ? 'bg-primary/[0.06]' : ''
                     }
                   >
                     <TableCell>