@commonpub/layer 0.3.13 → 0.3.15

package/components/ContentAttachments.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-defineProps<{
+const { attachments } = defineProps<{
   attachments: Array<{ type: string; url: string; name?: string }>;
 }>();
 
@@ -10,6 +10,15 @@ function iconForType(type: string): string {
   return 'fa-solid fa-file';
 }
 
+function isSafeUrl(url: string): boolean {
+  try {
+    const parsed = new URL(url);
+    return parsed.protocol === 'https:' || parsed.protocol === 'http:';
+  } catch {
+    return false;
+  }
+}
+
 function fileName(att: { url: string; name?: string }): string {
   if (att.name) return att.name;
   try {
@@ -18,14 +27,18 @@ function fileName(att: { url: string; name?: string }): string {
     return 'attachment';
   }
 }
+
+const safeAttachments = computed(() =>
+  attachments.filter((att) => att.url && att.type && isSafeUrl(att.url)),
+);
 </script>
 
 <template>
-  <div v-if="attachments.length > 0" class="cpub-attachments">
+  <div v-if="safeAttachments.length > 0" class="cpub-attachments">
     <div class="cpub-attachments-label">Attachments</div>
     <div class="cpub-attachments-list">
       <a
-        v-for="(att, i) in attachments"
+        v-for="(att, i) in safeAttachments"
         :key="i"
         :href="att.url"
         target="_blank"

package/components/MessageThread.vue

@@ -31,7 +31,7 @@ function handleSend(): void {
         v-for="msg in messages"
         :key="msg.id"
         class="cpub-msg"
-        :class="{ own: msg.senderId === currentUserId }"
+        :class="{ 'cpub-msg-own': msg.senderId === currentUserId }"
       >
         <div v-if="msg.senderId !== currentUserId" class="cpub-msg-sender">
           <img v-if="msg.senderAvatarUrl" :src="msg.senderAvatarUrl" :alt="msg.senderName ?? ''" class="cpub-msg-avatar" />
@@ -81,7 +81,7 @@ function handleSend(): void {
   max-width: 70%;
 }
 
-.cpub-msg.own {
+.cpub-msg.cpub-msg-own {
   align-self: flex-end;
 }
 

package/components/NotificationItem.vue

@@ -19,11 +19,16 @@ const iconMap: Record<string, string> = {
   follow: 'fa-solid fa-user-plus',
   mention: 'fa-solid fa-at',
   system: 'fa-solid fa-bell',
+  hub: 'fa-solid fa-users',
+  fork: 'fa-solid fa-code-fork',
+  build: 'fa-solid fa-hammer',
+  contest: 'fa-solid fa-trophy',
+  certificate: 'fa-solid fa-certificate',
 };
 </script>
 
 <template>
-  <div class="cpub-notif" :class="{ unread: !notification.read }">
+  <div class="cpub-notif" :class="{ 'cpub-notif-unread': !notification.read }">
     <div class="cpub-notif-avatar-wrap">
       <img v-if="notification.actorAvatarUrl" :src="notification.actorAvatarUrl" :alt="notification.actorName ?? ''" class="cpub-notif-avatar" />
       <div v-else class="cpub-notif-avatar cpub-notif-avatar-fallback">
@@ -42,7 +47,7 @@ const iconMap: Record<string, string> = {
         {{ new Date(notification.createdAt).toLocaleDateString('en-US', { month: 'short', day: 'numeric' }) }}
       </time>
     </div>
-    <NuxtLink v-if="notification.link || notification.targetUrl" :to="notification.link || notification.targetUrl || '#'" class="cpub-notif-link" aria-label="View">
+    <NuxtLink v-if="notification.link || notification.targetUrl" :to="notification.link || notification.targetUrl || '#'" class="cpub-notif-link" :aria-label="`View ${notification.type} notification`">
       <i class="fa-solid fa-arrow-right"></i>
     </NuxtLink>
   </div>
@@ -58,7 +63,7 @@ const iconMap: Record<string, string> = {
   border-bottom: var(--border-width-default) solid var(--border2);
 }
 
-.cpub-notif.unread {
+.cpub-notif.cpub-notif-unread {
   background: var(--accent-bg);
   border-color: var(--accent-border);
 }

package/composables/useMirrorContent.ts

@@ -83,7 +83,9 @@ export function useMirrorContent(fedContent: Ref<Record<string, unknown> | null>
       },
       buildCount: 0,
       bookmarkCount: 0,
-      attachments: Array.isArray(fc.attachments) ? (fc.attachments as Array<{ type: string; url: string; name?: string }>) : [],
+      attachments: Array.isArray(fc.attachments)
+        ? (fc.attachments as Array<Record<string, unknown>>).filter((a) => typeof a.type === 'string' && typeof a.url === 'string').map((a) => ({ type: a.type as string, url: a.url as string, name: typeof a.name === 'string' ? a.name : undefined }))
+        : [],
     } satisfies ContentViewData;
   });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commonpub/layer",
-  "version": "0.3.13",
+  "version": "0.3.15",
   "type": "module",
   "main": "./nuxt.config.ts",
   "files": [
@@ -46,12 +46,12 @@
     "zod": "^4.3.6",
     "@commonpub/auth": "0.5.0",
     "@commonpub/config": "0.7.0",
-    "@commonpub/docs": "0.5.2",
     "@commonpub/editor": "0.5.0",
-    "@commonpub/learning": "0.5.0",
     "@commonpub/protocol": "0.9.4",
-    "@commonpub/schema": "0.8.11",
-    "@commonpub/server": "2.11.0",
+    "@commonpub/docs": "0.5.2",
+    "@commonpub/schema": "0.8.12",
+    "@commonpub/learning": "0.5.0",
+    "@commonpub/server": "2.11.2",
     "@commonpub/ui": "0.7.1"
   },
   "scripts": {}

package/pages/federated-hubs/[id]/posts/[postId].vue

@@ -92,12 +92,10 @@ useSeoMeta({
   description: () => post.value?.content?.slice(0, 160) ?? '',
 });
 
-if (hub.value?.url) {
-  useHead({
-    link: [{ rel: 'canonical', href: hub.value.url }],
-    meta: [{ name: 'robots', content: 'noindex, follow' }],
-  });
-}
+useHead({
+  link: computed(() => hub.value?.url ? [{ rel: 'canonical', href: hub.value.url }] : []),
+  meta: computed(() => hub.value?.url ? [{ name: 'robots', content: 'noindex, follow' }] : []),
+});
 </script>
 
 <template>
@@ -145,7 +143,7 @@ if (hub.value?.url) {
         </div>
 
         <div class="cpub-post-actions">
-          <button class="cpub-post-action-btn" :class="{ active: liked }" :disabled="liking" @click="handleLike" :title="isAuthenticated ? (liked ? 'Unlike' : 'Like') : 'Log in to like'">
+          <button class="cpub-post-action-btn" :class="{ active: liked }" :disabled="liking" @click="handleLike" :aria-label="liked ? 'Unlike post' : 'Like post'" :aria-pressed="liked">
             <i :class="liked ? 'fa-solid fa-heart' : 'fa-regular fa-heart'"></i>
             {{ likeCount }}
           </button>
@@ -164,6 +162,7 @@ if (hub.value?.url) {
           class="cpub-reply-input"
           type="text"
           placeholder="Write a reply (sent via federation)..."
+          aria-label="Write a reply"
           @keydown.enter="handleReply"
         />
         <button class="cpub-btn cpub-btn-sm cpub-btn-primary" :disabled="replying || !replyContent.trim()" @click="handleReply">
@@ -251,7 +250,7 @@ if (hub.value?.url) {
   width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;
   background: var(--surface2); border: 1px solid var(--border);
   font-family: var(--font-mono); font-size: 10px; font-weight: 700; color: var(--text-dim);
-  border-radius: 50%; overflow: hidden;
+  overflow: hidden;
 }
 .cpub-post-avatar-img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
 

package/pages/federation/users/[handle].vue

@@ -8,6 +8,7 @@ const handle = computed(() => decodeURIComponent(route.params.handle as string))
 
 const { searchResult, searchLoading, searchError, searchRemoteUser, followRemoteUser, unfollowRemoteUser } = useFederation();
 const { user } = useAuth();
+const toast = useToast();
 
 const content = ref<FederatedContentItem[]>([]);
 const contentLoading = ref(false);
@@ -29,7 +30,7 @@ async function sendDm(): Promise<void> {
     showDmForm.value = false;
     setTimeout(() => { dmSent.value = false; }, 5000);
   } catch {
-    // TODO: show error toast
+    toast.error('Failed to send message');
   } finally {
     dmSending.value = false;
   }
@@ -107,6 +108,8 @@ function stripHtml(html: string): string {
               'cpub-remote-profile__follow-btn--pending': searchResult.isFollowPending,
             }"
             :disabled="searchResult.isFollowPending"
+            :aria-pressed="searchResult.isFollowing"
+            :aria-label="searchResult.isFollowing ? 'Unfollow user' : searchResult.isFollowPending ? 'Follow request pending' : 'Follow user'"
             @click="searchResult.isFollowing ? onUnfollow() : onFollow()"
           >
             {{ searchResult.isFollowing ? 'Following' : searchResult.isFollowPending ? 'Pending' : 'Follow' }}
@@ -128,6 +131,7 @@ function stripHtml(html: string): string {
           class="cpub-remote-profile__dm-textarea"
           placeholder="Write a message..."
           rows="3"
+          aria-label="Direct message"
         ></textarea>
         <div class="cpub-remote-profile__dm-actions">
           <button class="cpub-remote-profile__dm-send" :disabled="dmSending || !dmBody.trim()" @click="sendDm">
@@ -182,7 +186,7 @@ function stripHtml(html: string): string {
   color: var(--text-2);
   padding: var(--space-8) 0;
 }
-.cpub-remote-profile__error { color: var(--error, #f85149); }
+.cpub-remote-profile__error { color: var(--error); }
 .cpub-remote-profile__header {
   display: flex;
   align-items: center;
@@ -317,7 +321,7 @@ function stripHtml(html: string): string {
 }
 .cpub-remote-profile__dm-sent {
   font-size: var(--font-size-sm);
-  color: var(--green, #22c55e);
+  color: var(--green);
   font-weight: 600;
   margin-bottom: var(--space-4);
 }

package/pages/hubs/[slug]/posts/[postId].vue

@@ -62,20 +62,22 @@ async function toggleLike(): Promise<void> {
 
 // Mod actions
 async function togglePin(): Promise<void> {
+  const wasPinned = post.value?.isPinned;
   try {
     await $fetch(`/api/hubs/${slug.value}/posts/${postId.value}/pin`, { method: 'POST' });
     await refreshPost();
-    toast.success(post.value?.isPinned ? 'Post unpinned' : 'Post pinned');
+    toast.success(wasPinned ? 'Post unpinned' : 'Post pinned');
   } catch {
     toast.error('Failed to toggle pin');
   }
 }
 
 async function toggleLock(): Promise<void> {
+  const wasLocked = post.value?.isLocked;
   try {
     await $fetch(`/api/hubs/${slug.value}/posts/${postId.value}/lock`, { method: 'POST' });
     await refreshPost();
-    toast.success(post.value?.isLocked ? 'Post unlocked' : 'Post locked');
+    toast.success(wasLocked ? 'Post unlocked' : 'Post locked');
   } catch {
     toast.error('Failed to toggle lock');
   }
@@ -150,7 +152,7 @@ useSeoMeta({
       </div>
 
       <div v-if="editing" class="cpub-post-edit-form">
-        <textarea v-model="editContent" class="cpub-post-edit-textarea" rows="4"></textarea>
+        <textarea v-model="editContent" class="cpub-post-edit-textarea" rows="4" aria-label="Edit post content"></textarea>
         <div class="cpub-post-edit-actions">
           <button class="cpub-btn cpub-btn-sm cpub-btn-primary" :disabled="saving || !editContent.trim()" @click="saveEdit">
             {{ saving ? 'Saving...' : 'Save' }}
@@ -177,7 +179,7 @@ useSeoMeta({
         </div>
 
         <div class="cpub-post-actions">
-          <button class="cpub-post-action-btn" :class="{ active: post.isLiked }" :disabled="liking || !isAuthenticated" @click="toggleLike" :title="isAuthenticated ? 'Like' : 'Log in to like'">
+          <button class="cpub-post-action-btn" :class="{ active: post.isLiked }" :disabled="liking || !isAuthenticated" @click="toggleLike" :aria-label="post.isLiked ? 'Unlike post' : 'Like post'" :aria-pressed="post.isLiked ?? false">
             <i :class="post.isLiked ? 'fa-solid fa-heart' : 'fa-regular fa-heart'"></i>
             {{ post.likeCount ?? 0 }}
           </button>
@@ -210,7 +212,7 @@ useSeoMeta({
         Replying to a comment <button class="cpub-cancel-reply" @click="replyingTo = null"><i class="fa-solid fa-xmark"></i></button>
       </div>
       <div class="cpub-reply-row">
-        <input v-model="replyContent" class="cpub-reply-input" type="text" placeholder="Write a reply..." @keydown.enter="handleReply" />
+        <input v-model="replyContent" class="cpub-reply-input" type="text" placeholder="Write a reply..." aria-label="Write a reply" @keydown.enter="handleReply" />
         <button class="cpub-btn cpub-btn-sm cpub-btn-primary" :disabled="replying || !replyContent.trim()" @click="handleReply">
           <i class="fa-solid fa-paper-plane"></i> Reply
         </button>
@@ -352,7 +354,7 @@ useSeoMeta({
   display: flex; gap: 6px;
 }
 
-.cpub-btn-primary { background: var(--accent); color: #fff; border-color: var(--accent); }
+.cpub-btn-primary { background: var(--accent); color: var(--accent-text, #fff); border-color: var(--accent); }
 .cpub-btn-primary:hover:not(:disabled) { opacity: 0.9; }
 .cpub-btn-primary:disabled { opacity: 0.5; cursor: default; }
 .cpub-btn-danger { color: var(--red); border-color: var(--red); }

package/pages/messages/[conversationId].vue

@@ -2,7 +2,6 @@
 const route = useRoute();
 const conversationId = route.params.conversationId as string;
 
-useSeoMeta({ title: () => `Message — ${participantLabel.value}` });
 definePageMeta({ middleware: 'auth' });
 
 const { user } = useAuth();
@@ -57,17 +56,18 @@ const participantLabel = computed(() => {
   return others.length > 0 ? others.join(', ') : 'Conversation';
 });
 
+useSeoMeta({ title: () => `Message — ${participantLabel.value}` });
+
 async function handleSend(text: string): Promise<void> {
   await $fetch(`/api/messages/${conversationId}` as string, {
     method: 'POST',
     body: { body: text },
   });
   // SSE will pick up the new message, but also do an immediate refresh for responsiveness
-  refresh().then((result: any) => {
-    if (result?.data?.value) {
-      messages.value = result.data.value;
-    }
-  });
+  await refresh();
+  if (initialMessages.value) {
+    messages.value = [...initialMessages.value];
+  }
 }
 </script>
 

package/pages/mirror/[id].vue

@@ -117,6 +117,7 @@ useSeoMeta({
             <p v-if="transformedContent.author.bio" class="cpub-mirror-bio">{{ stripHtml(transformedContent.author.bio) }}</p>
           </div>
         </div>
+        <!-- Content is sanitized on ingest (inboxHandlers.ts → sanitizeHtml). Safe for v-html. -->
         <div v-if="typeof transformedContent.content === 'string'" class="cpub-mirror-body prose" v-html="transformedContent.content" />
         <ContentAttachments v-if="transformedContent.attachments?.length" :attachments="transformedContent.attachments" />
         <div v-if="transformedContent.tags?.length" class="cpub-mirror-tags">
@@ -146,7 +147,7 @@ useSeoMeta({
   display: flex; align-items: center; gap: 4px; font-size: 11px;
 }
 .cpub-fed-banner-follow {
-  margin-left: auto; background: var(--accent); color: #fff; border: none;
+  margin-left: auto; background: var(--accent); color: var(--accent-text, #fff); border: none;
   font-size: 11px; font-weight: 600; padding: 3px 10px; cursor: pointer;
   display: flex; align-items: center; gap: 4px; white-space: nowrap;
 }

package/server/api/federation/dm.post.ts

@@ -2,7 +2,7 @@ import { federateDirectMessage, resolveRemoteHandle } from '@commonpub/server';
 import { z } from 'zod';
 
 const dmSchema = z.object({
-  handle: z.string().min(3),
+  handle: z.string().min(3).regex(/^@?[\w.-]+@[\w.-]+\.\w+$/, 'Invalid federation handle'),
   body: z.string().min(1).max(10000),
 });
 
@@ -18,7 +18,12 @@ export default defineEventHandler(async (event) => {
     throw createError({ statusCode: 404, statusMessage: 'Could not resolve remote user' });
   }
 
-  await federateDirectMessage(db, user.id, resolved.actorUri, input.body, config.instance.domain);
+  try {
+    await federateDirectMessage(db, user.id, resolved.actorUri, input.body, config.instance.domain);
+  } catch (err) {
+    console.error('[federation-dm] Failed to deliver:', err);
+    throw createError({ statusCode: 502, statusMessage: 'Failed to deliver message to remote server' });
+  }
 
   return {
     sent: true,

package/server/api/hubs/[slug]/posts/[postId]/like.post.ts

@@ -1,4 +1,4 @@
-import { likePost, unlikePost, hasLikedPost, getHubBySlug, getPostById, federateHubPostLike } from '@commonpub/server';
+import { likePost, unlikePost, hasLikedPost, getHubBySlug, getPostById, federateHubPostLike, checkBan } from '@commonpub/server';
 
 export default defineEventHandler(async (event) => {
   const user = requireAuth(event);
@@ -12,6 +12,10 @@ export default defineEventHandler(async (event) => {
   const post = await getPostById(db, postId);
   if (!post || post.hubId !== community.id) throw createError({ statusCode: 404, statusMessage: 'Post not found' });
 
+  // Banned users cannot like posts
+  const ban = await checkBan(db, community.id, user.id);
+  if (ban) throw createError({ statusCode: 403, statusMessage: 'You are banned from this hub' });
+
   const alreadyLiked = await hasLikedPost(db, user.id, postId);
   if (alreadyLiked) {
     await unlikePost(db, user.id, postId);

package/server/api/hubs/[slug]/posts/[postId].put.ts

@@ -14,7 +14,7 @@ export default defineEventHandler(async (event): Promise<HubPostItem> => {
   }
 
   const input = await parseBody(event, editPostSchema);
-  const updated = await editPost(db, postId, user.id, input);
+  const updated = await editPost(db, postId, user.id, community.id, input);
   if (!updated) {
     throw createError({ statusCode: 403, statusMessage: 'Not authorized to edit this post' });
   }

package/server/api/hubs/[slug]/share.post.ts

@@ -57,11 +57,16 @@ export default defineEventHandler(async (event): Promise<HubPostItem> => {
     originDomain: fedContent.originDomain,
   });
 
-  const post = await createPost(db, user.id, {
-    hubId: hub.id,
-    type: 'share',
-    content: sharePayload,
-  });
+  let post;
+  try {
+    post = await createPost(db, user.id, {
+      hubId: hub.id,
+      type: 'share',
+      content: sharePayload,
+    });
+  } catch {
+    throw createError({ statusCode: 403, statusMessage: 'You must be a hub member to share content' });
+  }
 
   // Federate the share using the object URI of the federated content
   if (config.features.federation && config.features.federateHubs) {