diff --git a/app/components/AppNavigation.vue b/app/components/AppNavigation.vue index f113c52..1fa8ec4 100644 --- a/app/components/AppNavigation.vue +++ b/app/components/AppNavigation.vue @@ -173,6 +173,7 @@ const youItems = [ const exploreItems = [ { label: "Events", path: "/events" }, { label: "Members", path: "/members" }, + { label: "Connections", path: "/connections" }, { label: "Wiki", path: "/wiki" }, { label: "About", path: "/about" }, ]; diff --git a/app/pages/members/[id].vue b/app/pages/members/[id].vue index 6b4e254..0b47108 100644 --- a/app/pages/members/[id].vue +++ b/app/pages/members/[id].vue @@ -60,40 +60,42 @@

- -
-
Offering
-
+ +
+ +
{{ tag }}{{ tagLabel('craft', tag) }}
-

+

{{ member.offering.text }}

- +
- -
+ +
{{ tag }} + {{ stateLabel(topic.state) }} + {{ tagLabel('cooperative', topic.tagSlug || topic) }} +
-

+

+ {{ member.communityConnections.details }} +

+

{{ member.lookingFor.text }}

@@ -150,10 +152,10 @@
- -
+ +
-
+
Skills:
-
+
Topics:
-

- {{ member.peerSupport.availability }} +

+ {{ peerAvailability }}

@@ -233,6 +235,15 @@ const circleLabels = { practitioner: "Practitioner", }; +// State display text mapping +const stateLabels = { + help: "Can help", + interested: "Interested", + seeking: "Need help", +}; + +const stateLabel = (state) => stateLabels[state] || state || ""; + const getInitials = (name) => { if (!name) return "?"; return name @@ -246,6 +257,11 @@ const getInitials = (name) => { // Fetch member data — no await so the component renders immediately (no Suspense) const { data, pending, error: fetchError } = useFetch(`/api/members/${id}`); +// Fetch tags for slug-to-label lookup +const { data: tagsData } = useFetch("/api/tags", { + default: () => ({ tags: [] }), +}); + // Fetch public activity const { data: activityData } = useFetch(`/api/members/${id}/activity`, { params: { limit: 5 }, @@ -267,6 +283,56 @@ const formatRelativeDate = (date) => { } const member = computed(() => data.value?.member || null); +// Tag label lookup +const tagLabel = (pool, slug) => { + const tags = tagsData.value?.tags || []; + const found = tags.find((t) => t.slug === slug && t.pool === pool); + return found ? found.label : slug; +}; + +// Craft tags display: new field, falling back to offering.tags +const craftTagsDisplay = computed(() => { + if (!member.value) return []; + if (member.value.craftTags && member.value.craftTags.length > 0) { + return member.value.craftTags; + } + return member.value.offering?.tags || []; +}); + +// Connection topics display: new field, falling back to lookingFor.tags +const connectionTopicsDisplay = computed(() => { + if (!member.value) return []; + if ( + member.value.communityConnections?.topics && + member.value.communityConnections.topics.length > 0 + ) { + return member.value.communityConnections.topics; + } + if (member.value.lookingFor?.tags && member.value.lookingFor.tags.length > 0) { + return member.value.lookingFor.tags.map((tag) => ({ tagSlug: tag, state: null })); + } + return []; +}); + +// Peer support: check both new communityConnections and old peerSupport +const showPeerSupport = computed(() => { + if (!member.value) return false; + return ( + member.value.communityConnections?.offerPeerSupport || + member.value.peerSupport?.enabled + ); +}); + +// Peer availability: prefer new field, fall back to old +const peerAvailability = computed(() => { + if (!member.value) return ""; + return ( + member.value.communityConnections?.availability || + member.value.peerSupport?.availability || + "" + ); +}); + const pageBreadcrumbTitle = useState("pageBreadcrumbTitle", () => ""); watch( member, @@ -442,7 +508,8 @@ useHead({ } .offering-text, -.looking-text { +.looking-text, +.connection-details { margin-top: 8px; } @@ -462,6 +529,19 @@ useHead({ white-space: nowrap; } +.connection-pill { + display: inline-flex; + align-items: center; + gap: 4px; +} + +.connection-state { + font-size: 9px; + text-transform: uppercase; + letter-spacing: 0.04em; + color: var(--text-faint); +} + /* ---- SOCIAL LINKS ---- */ .social-links { display: flex; diff --git a/app/pages/members/index.vue b/app/pages/members/index.vue index a7d4658..dcf0cfd 100644 --- a/app/pages/members/index.vue +++ b/app/pages/members/index.vue @@ -41,64 +41,64 @@ >
- +
- Skills: + Craft:
- +
Topics:
@@ -117,16 +117,16 @@ Offering Peer Support - - {{ skill }} - + + {{ craftTagLabel(slug) }} + - - {{ topic }} - + + {{ connectionTagLabel(slug) }} +