@commonpub/layer 0.5.6 → 0.6.0

package/components/ContentCard.vue

@@ -47,12 +47,8 @@ const diffDots = computed(() => {
 
 const isFederated = computed(() => props.item.source === 'federated');
 
-const cardLink = computed(() => {
-  if (isFederated.value && props.item.federatedContentId) {
-    return `/mirror/${props.item.federatedContentId}`;
-  }
-  return `/${props.item.type}/${props.item.slug}`;
-});
+const { contentLink } = useContentUrl();
+const cardLink = computed(() => contentLink(props.item));
 
 const authorInitial = computed(() => {
   const name = props.item.author?.displayName || props.item.author?.username || '?';

package/components/hub/HubFeed.vue

@@ -61,7 +61,7 @@ const filteredPosts = computed(() => {
   <div v-if="filteredPosts.length" class="cpub-feed-list">
     <template v-for="post in filteredPosts" :key="post.id">
       <!-- Share posts -->
-      <NuxtLink v-if="post.sharedContent?.slug && !post.sharedContent?.url" :to="`/${post.sharedContent.type}/${post.sharedContent.slug}`" class="cpub-share-card">
+      <NuxtLink v-if="post.sharedContent?.slug && !post.sharedContent?.url" :to="(post.sharedContent as any).authorUsername ? `/u/${(post.sharedContent as any).authorUsername}/${post.sharedContent.type}/${post.sharedContent.slug}` : `/${post.sharedContent.type}/${post.sharedContent.slug}`" class="cpub-share-card">
         <div class="cpub-share-card-context">
           <i class="fa-solid fa-share-nodes"></i>
           {{ post.author.name }} shared a {{ post.sharedContent.type }}

package/components/views/ArticleView.vue

@@ -46,7 +46,8 @@ const followingAuthor = ref((props.content as unknown as Record<string, unknown>
 
 async function handleFollowAuthor(): Promise<void> {
   if (!isAuthenticated.value) {
-    await navigateTo(`/auth/login?redirect=/article/${props.content.slug}`);
+    const { contentPath } = useContentUrl();
+    await navigateTo(`/auth/login?redirect=${contentPath(props.content.author?.username ?? '', props.content.type, props.content.slug)}`);
     return;
   }
   const username = props.content.author?.username;
@@ -69,7 +70,7 @@ useJsonLd({
   type: 'article',
   title: props.content.title,
   description: props.content.seoDescription ?? props.content.description ?? '',
-  url: `${config.public.siteUrl}/article/${props.content.slug}`,
+  url: `${config.public.siteUrl}/u/${props.content.author?.username}/${props.content.type}/${props.content.slug}`,
   imageUrl: props.content.coverImageUrl ?? undefined,
   authorName: props.content.author?.displayName ?? props.content.author?.username ?? '',
   authorUrl: `${config.public.siteUrl}/u/${props.content.author?.username}`,
@@ -207,7 +208,7 @@ useJsonLd({
         <NuxtLink
           v-for="item in content.related.slice(0, 3)"
           :key="item.id"
-          :to="`/${item.type}/${item.slug}`"
+          :to="(item as any).author?.username ? `/u/${(item as any).author.username}/${item.type}/${item.slug}` : `/${item.type}/${item.slug}`"
           class="cpub-related-card"
         >
           <div class="cpub-related-card-thumb">

package/components/views/BlogView.vue

@@ -26,7 +26,7 @@ useJsonLd({
   type: 'article',
   title: props.content.title,
   description: props.content.seoDescription ?? props.content.description ?? '',
-  url: `${config.public.siteUrl}/blog/${props.content.slug}`,
+  url: `${config.public.siteUrl}/u/${props.content.author?.username}/${props.content.type}/${props.content.slug}`,
   imageUrl: props.content.coverImageUrl ?? undefined,
   authorName: props.content.author?.displayName ?? props.content.author?.username ?? '',
   authorUrl: `${config.public.siteUrl}/u/${props.content.author?.username}`,

package/components/views/ExplainerView.vue

@@ -110,7 +110,7 @@ useJsonLd({
   type: 'article',
   title: props.content.title,
   description: props.content.seoDescription ?? props.content.description ?? '',
-  url: `${runtimeConfig.public.siteUrl}/explainer/${props.content.slug}`,
+  url: `${runtimeConfig.public.siteUrl}/u/${props.content.author?.username}/${props.content.type}/${props.content.slug}`,
   imageUrl: props.content.coverImageUrl ?? undefined,
   authorName: props.content.author?.displayName ?? props.content.author?.username ?? '',
   authorUrl: `${runtimeConfig.public.siteUrl}/u/${props.content.author?.username}`,
@@ -169,7 +169,7 @@ onUnmounted(() => { document.removeEventListener('keydown', onKeydown); });
     <ScrollViewer :document="explainerDoc" />
     <NuxtLink
       v-if="isOwner"
-      :to="`/${content.type}/${content.slug}/edit`"
+      :to="`/u/${content.author?.username}/${content.type}/${content.slug}/edit`"
       class="cpub-scroll-edit-btn"
       title="Edit explainer"
       aria-label="Edit explainer"
@@ -212,7 +212,7 @@ onUnmounted(() => { document.removeEventListener('keydown', onKeydown); });
       </button>
       <NuxtLink
         v-if="isOwner"
-        :to="`/${content.type}/${content.slug}/edit`"
+        :to="`/u/${content.author?.username}/${content.type}/${content.slug}/edit`"
         class="cpub-icon-btn cpub-edit-link"
         title="Edit explainer"
         aria-label="Edit explainer"

package/components/views/ProjectView.vue

@@ -2,6 +2,7 @@
 import type { ContentViewData } from '../../composables/useEngagement';
 
 const { hubs: hubsEnabled } = useFeatures();
+const { user: authUser } = useAuth();
 
 const props = defineProps<{
   content: ContentViewData;
@@ -49,7 +50,7 @@ useJsonLd({
   type: 'howto',
   title: props.content.title,
   description: props.content.seoDescription ?? props.content.description ?? '',
-  url: `${config.public.siteUrl}/project/${props.content.slug}`,
+  url: `${config.public.siteUrl}/u/${props.content.author?.username}/${props.content.type}/${props.content.slug}`,
   imageUrl: props.content.coverImageUrl ?? undefined,
   authorName: props.content.author?.displayName ?? props.content.author?.username ?? '',
   authorUrl: `${config.public.siteUrl}/u/${props.content.author?.username}`,
@@ -268,7 +269,7 @@ async function handleFork(): Promise<void> {
       ? `/api/federation/content/${props.federatedId}/fork`
       : `/api/content/${props.content.id}/fork`;
     const result = await $fetch<{ slug: string; type: string }>(url, { method: 'POST' });
-    await navigateTo(`/${result.type}/${result.slug}/edit`);
+    await navigateTo(`/u/${authUser.value?.username ?? ''}/${result.type}/${result.slug}/edit`);
   } catch {
     // fork failed silently
   } finally {

package/composables/useContentSave.ts

@@ -16,6 +16,8 @@ export interface ContentSaveOptions {
   extractError: (err: unknown) => string;
   /** Called after every save to sync product links from partsList blocks */
   onAfterSave?: (id: string) => Promise<void>;
+  /** Author username for user-scoped URLs (/u/{username}/{type}/{slug}) */
+  username?: Ref<string>;
 }
 
 export interface ContentSaveReturn {
@@ -53,6 +55,16 @@ function slugify(text: string): string {
 const AUTO_SAVE_DELAY = 30_000;
 
 export function useContentSave(opts: ContentSaveOptions): ContentSaveReturn {
+  // URL helpers — use user-scoped paths when username is available
+  function viewPath(type: string, slug: string): string {
+    if (opts.username?.value) return `/u/${opts.username.value}/${type}/${slug}`;
+    return `/${type}/${slug}`;
+  }
+  function editPath(type: string, slug: string): string {
+    if (opts.username?.value) return `/u/${opts.username.value}/${type}/${slug}/edit`;
+    return `/${type}/${slug}/edit`;
+  }
+
   const saving = ref(false);
   const error = ref('');
   const autoSaveStatus = ref<'idle' | 'saving' | 'saved' | 'error'>('idle');
@@ -108,14 +120,14 @@ export function useContentSave(opts: ContentSaveOptions): ContentSaveReturn {
         opts.isDirty.value = false;
         autoSaveStatus.value = 'saved';
         if (opts.onAfterSave) await opts.onAfterSave(result.id);
-        history.replaceState({}, '', `/${opts.contentType.value}/${result.slug}/edit`);
+        history.replaceState({}, '', editPath(opts.contentType.value, result.slug));
       } else {
         const updated = await $fetch<{ slug: string }>(`/api/content/${opts.contentId.value}`, { method: 'PUT', body });
         opts.isDirty.value = false;
         autoSaveStatus.value = 'saved';
         if (opts.onAfterSave) await opts.onAfterSave(opts.contentId.value!);
         if (updated?.slug) {
-          history.replaceState({}, '', `/${opts.contentType.value}/${updated.slug}/edit`);
+          history.replaceState({}, '', editPath(opts.contentType.value, updated.slug));
         }
       }
 
@@ -145,13 +157,13 @@ export function useContentSave(opts: ContentSaveOptions): ContentSaveReturn {
         opts.isNew.value = false;
         opts.isDirty.value = false;
         if (opts.onAfterSave) await opts.onAfterSave(result.id);
-        await navigateTo(`/${opts.contentType.value}/${result.slug}`);
+        await navigateTo(viewPath(opts.contentType.value, result.slug));
       } else {
         const updated = await $fetch<{ slug?: string }>(`/api/content/${opts.contentId.value}`, { method: 'PUT', body });
         opts.isDirty.value = false;
         if (opts.onAfterSave) await opts.onAfterSave(opts.contentId.value!);
         const currentSlug = updated?.slug || useRoute().params.slug as string;
-        await navigateTo(`/${opts.contentType.value}/${currentSlug}`);
+        await navigateTo(viewPath(opts.contentType.value, currentSlug));
       }
     } catch (err: unknown) {
       error.value = opts.extractError(err);
@@ -203,7 +215,7 @@ export function useContentSave(opts: ContentSaveOptions): ContentSaveReturn {
       }
 
       opts.isDirty.value = false;
-      await navigateTo(`/${opts.contentType.value}/${resultSlug}`);
+      await navigateTo(viewPath(opts.contentType.value, resultSlug));
       return [];
     } catch (err: unknown) {
       error.value = opts.extractError(err);

package/composables/useContentUrl.ts

@@ -0,0 +1,62 @@
+// Content URL composable — single source of truth for content path construction
+
+/**
+ * Returns helpers for constructing content URLs in the new `/u/{username}/{type}/{slug}` format.
+ *
+ * Usage:
+ *   const { contentPath, contentEditPath, contentNewPath } = useContentUrl();
+ *   const path = contentPath('alice', 'project', 'robot-arm');  // '/u/alice/project/robot-arm'
+ */
+export function useContentUrl() {
+  const config = useRuntimeConfig();
+  const siteUrl = computed(() => config.public.siteUrl as string);
+
+  /** Build relative path: /u/{username}/{type}/{slug} */
+  function contentPath(username: string, type: string, slug: string): string {
+    return `/u/${username}/${type}/${slug}`;
+  }
+
+  /** Build relative edit path: /u/{username}/{type}/{slug}/edit */
+  function contentEditPath(username: string, type: string, slug: string): string {
+    return `/u/${username}/${type}/${slug}/edit`;
+  }
+
+  /** Build relative create path: /u/{username}/{type}/new/edit */
+  function contentNewPath(username: string, type: string): string {
+    return `/u/${username}/${type}/new/edit`;
+  }
+
+  /** Build absolute URL for SEO/feeds: https://domain/u/{username}/{type}/{slug} */
+  function contentUrl(username: string, type: string, slug: string): string {
+    return `${siteUrl.value}/u/${username}/${type}/${slug}`;
+  }
+
+  /**
+   * Build a content link from an item object (the common case in templates).
+   * Handles federated content by returning the mirror path instead.
+   */
+  function contentLink(item: {
+    type: string;
+    slug: string;
+    author?: { username: string } | null;
+    source?: string;
+    federatedContentId?: string;
+  }): string {
+    if (item.source === 'federated' && item.federatedContentId) {
+      return `/mirror/${item.federatedContentId}`;
+    }
+    if (!item.author?.username) {
+      // Fallback for items missing author — should not happen in practice
+      return `/${item.type}/${item.slug}`;
+    }
+    return `/u/${item.author.username}/${item.type}/${item.slug}`;
+  }
+
+  return {
+    contentPath,
+    contentEditPath,
+    contentNewPath,
+    contentUrl,
+    contentLink,
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commonpub/layer",
-  "version": "0.5.6",
+  "version": "0.6.0",
   "type": "module",
   "main": "./nuxt.config.ts",
   "files": [
@@ -50,16 +50,16 @@
     "vue": "^3.4.0",
     "vue-router": "^4.3.0",
     "zod": "^4.3.6",
-    "@commonpub/explainer": "0.7.0",
-    "@commonpub/docs": "0.6.0",
-    "@commonpub/config": "0.8.0",
     "@commonpub/auth": "0.5.0",
+    "@commonpub/config": "0.8.0",
+    "@commonpub/docs": "0.6.0",
     "@commonpub/editor": "0.5.0",
-    "@commonpub/protocol": "0.9.6",
-    "@commonpub/schema": "0.8.17",
     "@commonpub/learning": "0.5.0",
-    "@commonpub/ui": "0.8.4",
-    "@commonpub/server": "2.25.0"
+    "@commonpub/explainer": "0.7.1",
+    "@commonpub/schema": "0.8.18",
+    "@commonpub/server": "2.26.0",
+    "@commonpub/protocol": "0.9.7",
+    "@commonpub/ui": "0.8.4"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",