@gogitcms/editor 0.30.0 → 0.31.0

package/app/src/App.tsx

@@ -73,7 +73,7 @@ type Branch = {
   writableProjects?: string[];
 };
 type Workspace = { id: string; name: string; slug: string };
-type Project = { name: string; label: string; orphaned: boolean };
+type Project = { id: string; name: string; label: string; orphaned: boolean };
 type Repository = { id: string; owner: string; name: string; branches: Branch[]; defaultBranch: string; projects?: Project[] };
 
 // Resolve which project to open, and whether the choice is the user's to make.
@@ -597,10 +597,13 @@ function RepoPicker({
 }
 
 // Maps a GraphQL notification row to the design-system NotificationItem shape.
-type GqlNotification = { id: string; title: string; body?: string | null; level: string; read: boolean; createdAt: string; authorName?: string | null; authorEmail?: string | null };
+type GqlNotification = { id: string; kind?: string | null; title: string; body?: string | null; level: string; read: boolean; createdAt: string; authorName?: string | null; authorEmail?: string | null; repository?: string | null; project?: string | null };
 const toNotificationItem = (n: GqlNotification): NotificationItem => ({
   id: n.id,
+  kind: n.kind ?? undefined,
   title: n.title,
+  // The bell is scoped to the repository or project being edited, so naming
+  // either on every row would be noise; the title already carries the branch.
   body: n.body ?? undefined,
   level: n.level === "error" ? "error" : "info",
   read: n.read,
@@ -690,6 +693,7 @@ function CmsView({
   branch,
   defaultBranchId,
   projectName,
+  projectId,
   projects,
   soleProjectName,
   projectLocked,
@@ -706,6 +710,10 @@ function CmsView({
   // projects have not loaded, and for local mode; every content query passes it
   // through, and the server applies the same defaulting rule when it is absent.
   projectName?: string;
+  // The id of that project, when it resolved to one the repository has. It
+  // scopes the notification bell: a project's own notifications plus the
+  // repository-wide ones. Undefined falls back to the whole repository.
+  projectId?: string;
   // The repository's non-orphaned projects, for the picker. One (or none) hides
   // the picker entirely — a repository without a manifest should look exactly as
   // it did before projects existed.
@@ -796,11 +804,11 @@ function CmsView({
   // Notifications for this repository context. Polls so the bell reflects new
   // import/export outcomes without a manual refresh.
   const { data: notifData, refetch: refetchNotifs } = useQuery(NOTIFICATIONS, {
-    variables: { repositoryId: repo.id, limit: 50 },
+    variables: { repositoryId: repo.id, projectId: projectId ?? null, limit: 50 },
     pollInterval: 30000,
   });
   const [markAllRead] = useMutation(MARK_NOTIFICATIONS_READ, {
-    variables: { repositoryId: repo.id },
+    variables: { repositoryId: repo.id, projectId: projectId ?? null },
   });
   const notifications: NotificationItem[] = (notifData?.notifications ?? []).map(toNotificationItem);
   const unreadNotifications: number = notifData?.unreadNotificationCount ?? 0;
@@ -2704,6 +2712,7 @@ function BrowserScreen({ onSignOut, workspaces }: { onSignOut: () => void; works
       // fully usable and only the notification bell reports it.
       importing={branchImport.importing}
       projectName={project.name}
+      projectId={project.project?.id}
       projects={project.projects}
       soleProjectName={project.sole?.name}
       projectLocked={project.locked}

package/app/src/queries.ts

@@ -34,6 +34,7 @@ export const REPOSITORIES = gql`
       }
       defaultBranch
       projects {
+        id
         name
         label
         orphaned
@@ -459,10 +460,15 @@ export const ME = gql`
   }
 `;
 
+// Scoped to the project being edited when there is one: that project's own
+// notifications plus the repository-wide ones (imports, exports, branches,
+// change requests) that concern every project on the branch. Without a project
+// id it falls back to the whole repository.
 export const NOTIFICATIONS = gql`
-  query Notifications($repositoryId: ID, $limit: Int) {
-    notifications(repositoryId: $repositoryId, limit: $limit) {
+  query Notifications($repositoryId: ID, $projectId: ID, $limit: Int) {
+    notifications(repositoryId: $repositoryId, projectId: $projectId, limit: $limit) {
       id
+      kind
       title
       body
       level
@@ -470,8 +476,10 @@ export const NOTIFICATIONS = gql`
       createdAt
       authorName
       authorEmail
+      repository
+      project
     }
-    unreadNotificationCount(repositoryId: $repositoryId)
+    unreadNotificationCount(repositoryId: $repositoryId, projectId: $projectId)
   }
 `;
 
@@ -510,8 +518,8 @@ export const BRANCH_IMPORT_PROGRESS = gql`
 `;
 
 export const MARK_NOTIFICATIONS_READ = gql`
-  mutation MarkNotificationsRead($repositoryId: ID) {
-    markNotificationsRead(all: true, repositoryId: $repositoryId)
+  mutation MarkNotificationsRead($repositoryId: ID, $projectId: ID) {
+    markNotificationsRead(all: true, repositoryId: $repositoryId, projectId: $projectId)
   }
 `;
 

package/app/vendor/design-system/src/components/Notifications.tsx

@@ -4,10 +4,11 @@ import { useTheme, useThemeMode, ThemeScope } from "../ThemeProvider";
 import { lightTheme, darkTheme } from "../theme";
 import { Text } from "./Text";
 import { Icon } from "./Icon";
+import type { IconName } from "../icons";
 import { Spinner } from "./Spinner";
 
 // One notification, shaped for display. Transport-agnostic: the frontend/mobile
-// apps map GraphQL rows and the desktop maps REST rows into this.
+// apps map GraphQL rows and the desktop and dashboard map REST rows into this.
 export type NotificationItem = {
   id: string;
   title: string;
@@ -16,8 +17,39 @@ export type NotificationItem = {
   read: boolean;
   createdAt: string; // ISO 8601
   author?: string; // display name/email of who caused it, when known
+  // What produced it — picks the icon. Unknown kinds fall back to the bell.
+  kind?: NotificationKind | string;
+  // Where it happened, for a list that spans several repositories/projects.
+  // Omit whichever the list is already scoped to.
+  repository?: string;
+  project?: string;
 };
 
+export type NotificationKind = "import" | "export" | "merge" | "change_request" | "member" | "branch" | "project";
+
+// The icon for a notification kind. Exported so hosts that draw their own rows
+// (a scope picker's section headers, say) agree with the list.
+export function notificationKindIcon(kind?: string): IconName {
+  switch (kind) {
+    case "import":
+      return "download";
+    case "export":
+      return "upload";
+    case "merge":
+      return "gitMerge";
+    case "change_request":
+      return "gitPullRequest";
+    case "member":
+      return "user";
+    case "branch":
+      return "gitBranch";
+    case "project":
+      return "folder";
+    default:
+      return "bell";
+  }
+}
+
 // relativeTime renders a compact age ("just now", "5m", "3h", "2d").
 function relativeTime(iso: string): string {
   const then = Date.parse(iso);
@@ -32,7 +64,65 @@ function relativeTime(iso: string): string {
   return `${days}d`;
 }
 
-// A single notification row: an unread dot + level-tinted title, body, and age.
+// InlineCode renders a sentence whose backticked spans (`main`, `#12`'s
+// branch) are set in the mono face, so a title like "Created `zyx` branch"
+// reads as prose around a name rather than as punctuation. An unmatched
+// backtick is left as typed.
+export function InlineCode({
+  text,
+  variant = "sm",
+  weight,
+  color,
+  numberOfLines,
+  testID,
+}: {
+  text: string;
+  variant?: "sm" | "body" | "monoSm" | "xs";
+  weight?: "regular" | "medium" | "semibold";
+  color?: string;
+  numberOfLines?: number;
+  testID?: string;
+}) {
+  const t = useTheme();
+  const parts = text.split("`");
+  // An even number of parts means an odd number of backticks: not a pair, so
+  // render the text untouched.
+  if (parts.length % 2 === 0) {
+    return (
+      <Text variant={variant} weight={weight} color={color} numberOfLines={numberOfLines} testID={testID}>
+        {text}
+      </Text>
+    );
+  }
+  return (
+    <Text variant={variant} weight={weight} color={color} numberOfLines={numberOfLines} testID={testID}>
+      {parts.map((part, i) =>
+        i % 2 === 1 ? (
+          <Text
+            key={i}
+            variant={variant}
+            weight={weight}
+            color={color}
+            mono
+            style={{
+              backgroundColor: t.color.surfaceSunken,
+              borderRadius: t.radius.sm,
+              paddingHorizontal: 3,
+            }}
+          >
+            {part}
+          </Text>
+        ) : (
+          part
+        ),
+      )}
+    </Text>
+  );
+}
+
+// A single notification row: a kind icon, the title (unread rows in bold, error
+// rows tinted), the body, and a context line — where it happened and who did
+// it — with the age on the right.
 function NotificationRow({
   item,
   divided,
@@ -44,12 +134,16 @@ function NotificationRow({
 }) {
   const t = useTheme();
   const titleColor = item.level === "error" ? t.color.diffDelFg : t.color.textPrimary;
+  const context = [item.repository, item.project].filter(Boolean).join(" · ");
+  const meta = [context, item.author ? `by ${item.author}` : ""].filter(Boolean).join(" · ");
   return (
     <Pressable
       onPress={onPress}
+      disabled={!onPress}
+      testID={`notification-${item.id}`}
       style={({ pressed, hovered }: { pressed: boolean; hovered?: boolean }) => ({
         flexDirection: "row",
-        gap: t.space(2.5),
+        gap: t.space(3),
         paddingHorizontal: t.space(4),
         paddingVertical: t.space(3),
         borderBottomWidth: divided ? 1 : 0,
@@ -57,33 +151,57 @@ function NotificationRow({
         backgroundColor: hovered || pressed ? t.color.surfaceHover : "transparent",
       })}
     >
-      <View
-        style={{
-          width: 8,
-          height: 8,
-          marginTop: 5,
-          borderRadius: t.radius.pill,
-          backgroundColor: item.read ? "transparent" : t.color.diffDelFg,
-        }}
-      />
-      <View style={{ flex: 1, gap: 2 }}>
-        <View style={{ flexDirection: "row", alignItems: "center", gap: t.space(2) }}>
-          <Text
-            variant="sm"
-            weight={item.read ? "medium" : "semibold"}
-            color={titleColor}
-            numberOfLines={2}
-            style={{ flex: 1 }}
-          >
-            {item.title}
-          </Text>
+      <View style={{ width: 28, height: 28, alignItems: "center", justifyContent: "center", position: "relative" }}>
+        <View
+          style={{
+            width: 28,
+            height: 28,
+            borderRadius: t.radius.pill,
+            alignItems: "center",
+            justifyContent: "center",
+            backgroundColor: item.level === "error" ? t.color.diffDelBg : t.color.surfaceSunken,
+          }}
+        >
+          <Icon
+            name={notificationKindIcon(item.kind)}
+            size={14}
+            color={item.level === "error" ? t.color.diffDelFg : t.color.textSecondary}
+          />
+        </View>
+        {/* Unread dot, riding on the icon's corner. */}
+        {item.read ? null : (
+          <View
+            testID="notification-unread"
+            style={{
+              position: "absolute",
+              top: -1,
+              right: -1,
+              width: 8,
+              height: 8,
+              borderRadius: t.radius.pill,
+              backgroundColor: t.color.diffDelFg,
+              borderWidth: 1,
+              borderColor: t.color.surfaceRaised,
+            }}
+          />
+        )}
+      </View>
+      <View style={{ flex: 1, gap: 2, minWidth: 0 }}>
+        <View style={{ flexDirection: "row", alignItems: "flex-start", gap: t.space(2) }}>
+          <View style={{ flex: 1, minWidth: 0 }}>
+            <InlineCode
+              text={item.title}
+              variant="sm"
+              weight={item.read ? "medium" : "semibold"}
+              color={titleColor}
+              numberOfLines={2}
+            />
+          </View>
           <Text variant="monoSm" color="tertiary">{relativeTime(item.createdAt)}</Text>
         </View>
-        {item.body ? (
-          <Text variant="monoSm" color="secondary" numberOfLines={2}>{item.body}</Text>
-        ) : null}
-        {item.author ? (
-          <Text variant="monoSm" color="tertiary" numberOfLines={1}>{`by ${item.author}`}</Text>
+        {item.body ? <InlineCode text={item.body} variant="monoSm" color={t.color.textSecondary} numberOfLines={2} /> : null}
+        {meta ? (
+          <Text variant="monoSm" color="tertiary" numberOfLines={1}>{meta}</Text>
         ) : null}
       </View>
     </Pressable>

package/app/vendor/design-system/src/icons.ts

@@ -28,6 +28,7 @@ export const icons = {
   chevronDown: ["m6 9 6 6 6-6"],
   chevronUp: ["m18 15-6-6-6 6"],
   folder: ["M3 6a2 2 0 0 1 2-2h5l2 2h7a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"],
+  user: ["M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", "M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z"],
   building: ["M3 21h18", "M6 21V7l7-4v18", "M18 21V11l-5-3"],
   menu: ["M3 6h18", "M3 12h18", "M3 18h18"],
   plus: ["M5 12h14", "M12 5v14"],

package/app/vendor/design-system/src/index.ts

@@ -115,9 +115,10 @@ export { Spinner } from "./components/Spinner";
 export type { SpinnerProps } from "./components/Spinner";
 
 // Notifications
-export { NotificationBell, NotificationList } from "./components/Notifications";
+export { NotificationBell, NotificationList, InlineCode, notificationKindIcon } from "./components/Notifications";
 export type {
   NotificationItem,
+  NotificationKind,
   NotificationBellProps,
   NotificationListProps,
 } from "./components/Notifications";

package/npm-shrinkwrap.json

@@ -1,12 +1,12 @@
 {
   "name": "@gogitcms/editor",
-  "version": "0.30.0",
+  "version": "0.31.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@gogitcms/editor",
-      "version": "0.30.0",
+      "version": "0.31.0",
       "dependencies": {
         "@apollo/client": "^3.11.8",
         "@handlewithcare/react-prosemirror": "^3.2.7",
@@ -47,11 +47,11 @@
         "node": ">=20"
       },
       "optionalDependencies": {
-        "@gogitcms/gitcms-local-darwin-arm64": "0.30.0",
-        "@gogitcms/gitcms-local-darwin-x64": "0.30.0",
-        "@gogitcms/gitcms-local-linux-arm64": "0.30.0",
-        "@gogitcms/gitcms-local-linux-x64": "0.30.0",
-        "@gogitcms/gitcms-local-win32-x64": "0.30.0"
+        "@gogitcms/gitcms-local-darwin-arm64": "0.31.0",
+        "@gogitcms/gitcms-local-darwin-x64": "0.31.0",
+        "@gogitcms/gitcms-local-linux-arm64": "0.31.0",
+        "@gogitcms/gitcms-local-linux-x64": "0.31.0",
+        "@gogitcms/gitcms-local-win32-x64": "0.31.0"
       }
     },
     "node_modules/@apollo/client": {
@@ -751,9 +751,9 @@
       }
     },
     "node_modules/@gogitcms/gitcms-local-darwin-arm64": {
-      "version": "0.30.0",
-      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-darwin-arm64/-/gitcms-local-darwin-arm64-0.30.0.tgz",
-      "integrity": "sha512-X1OFPGdHVDZ/TuWoQdcUyc8rSxQ44qWXLAXL1agz+h41EuxlIgR+C+1DqS6EvGCVY/HXZKIg2L3sqAM8HxKO5w==",
+      "version": "0.31.0",
+      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-darwin-arm64/-/gitcms-local-darwin-arm64-0.31.0.tgz",
+      "integrity": "sha512-3kFrkx9Ds2GweknBkxuuGBix0/dgAwnw1eV/RgDX88ghI8SpuDps5J9xJBT52Si9ECzv+Mb8sV9VOauJTVkO+Q==",
       "cpu": [
         "arm64"
       ],
@@ -764,9 +764,9 @@
       ]
     },
     "node_modules/@gogitcms/gitcms-local-darwin-x64": {
-      "version": "0.30.0",
-      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-darwin-x64/-/gitcms-local-darwin-x64-0.30.0.tgz",
-      "integrity": "sha512-LVStgvvQFlWkJuiZYFxhuEtYBu2lMNG4TpOM3JcO2rqjhuT1QRtumvORnR+Jtz7LXvGgFFnQR7GEJD20OIj6OA==",
+      "version": "0.31.0",
+      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-darwin-x64/-/gitcms-local-darwin-x64-0.31.0.tgz",
+      "integrity": "sha512-ngZjKwk9p7rkVX08VLUWH3LTtvl6BBPO0oS3E452feV0twpnVxE3bebWRop3/t8509N2siBJjHVabVkYOQUxFg==",
       "cpu": [
         "x64"
       ],
@@ -777,9 +777,9 @@
       ]
     },
     "node_modules/@gogitcms/gitcms-local-linux-x64": {
-      "version": "0.30.0",
-      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-linux-x64/-/gitcms-local-linux-x64-0.30.0.tgz",
-      "integrity": "sha512-FmyMNRPy+JI85YTY+kPD7l5sAtdhjLYSDk5o8iAswTj7EuBA+Prg2Nzfc2JLSCAd8KBS5Nu0ZImUzuSV96z8tQ==",
+      "version": "0.31.0",
+      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-linux-x64/-/gitcms-local-linux-x64-0.31.0.tgz",
+      "integrity": "sha512-LhrkSSxJcW+MhVbek5z/ZRizIuCdZaD7GsqOgIOrv/EAq/CXXa/gI8bpMqpOdKgzShISln1nZV5A4RB+6YPe+g==",
       "cpu": [
         "x64"
       ],
@@ -789,19 +789,6 @@
         "linux"
       ]
     },
-    "node_modules/@gogitcms/gitcms-local-win32-x64": {
-      "version": "0.30.0",
-      "resolved": "https://registry.npmjs.org/@gogitcms/gitcms-local-win32-x64/-/gitcms-local-win32-x64-0.30.0.tgz",
-      "integrity": "sha512-5gfXP9N0XJslyZPmRYNBFF2XSHyQEh+aZ5HZMk92RlSGhVLzkZXYjNOfcDLsN7L2rnLsnTHwpm04W0sjMVe6XA==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "UNLICENSED",
-      "optional": true,
-      "os": [
-        "win32"
-      ]
-    },
     "node_modules/@graphql-typed-document-node/core": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/@graphql-typed-document-node/core/-/core-3.2.0.tgz",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gogitcms/editor",
-  "version": "0.30.0",
+  "version": "0.31.0",
   "description": "Terminal UI for setting up and running the Go·Git CMS content editor",
   "type": "module",
   "bin": {
@@ -65,10 +65,10 @@
     "@gogitcms/frontend": "workspace:*"
   },
   "optionalDependencies": {
-    "@gogitcms/gitcms-local-darwin-arm64": "0.30.0",
-    "@gogitcms/gitcms-local-darwin-x64": "0.30.0",
-    "@gogitcms/gitcms-local-linux-arm64": "0.30.0",
-    "@gogitcms/gitcms-local-linux-x64": "0.30.0",
-    "@gogitcms/gitcms-local-win32-x64": "0.30.0"
+    "@gogitcms/gitcms-local-darwin-arm64": "0.31.0",
+    "@gogitcms/gitcms-local-darwin-x64": "0.31.0",
+    "@gogitcms/gitcms-local-linux-arm64": "0.31.0",
+    "@gogitcms/gitcms-local-linux-x64": "0.31.0",
+    "@gogitcms/gitcms-local-win32-x64": "0.31.0"
   }
 }