feat: community voice UI #1426

emlimlf · 2025-11-21T05:43:15Z

In this PR

Created a new section in the projects page called community voice
This new section is only available to logged in users and have the same permissions as the one used for the copilot feature

Ticket

IN-852

Signed-off-by: Efren Lim <[email protected]>

…insights into feat/community-voice-ui

Signed-off-by: Efren Lim <[email protected]>

github-actions

Conventional Commits FTW!

Signed-off-by: Efren Lim <[email protected]>

Copilot

Pull Request Overview

This PR introduces a new "Community Voice" section to the projects page that displays mentions and discussions about projects from various social media and community platforms (YouTube, X/Twitter, Reddit, HackerNews, etc.). The feature is only available to logged in users and uses the same permission model as the Copilot feature.

Key changes:

Added Community Voice pages for project, repository, and repository group levels
Integrated new community platform configurations (YouTube, X/Twitter, Reddit, HackerNews)
Enhanced dropdown and popover components with customizable z-index via popoverClass prop
Added sentiment filtering configuration (positive, neutral, negative)

Reviewed Changes

Copilot reviewed 49 out of 60 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
frontend/app/pages/project/[slug]/community-voice.vue	New community voice page at project level with SEO noindex
frontend/app/pages/project/[slug]/repository/[name]/community-voice.vue	New community voice page at repository level with SEO noindex
frontend/app/pages/project/[slug]/repository-group/[groupSlug]/community-voice.vue	New community voice page at repository group level with SEO noindex
frontend/app/layouts/default.vue	Added global community filter component to default layout
frontend/app/components/uikit/popover/popover.vue	Enhanced popover with customizable CSS class for z-index control
frontend/app/components/uikit/dropdown/dropdown.vue	Enhanced dropdown with popover class support
frontend/app/components/uikit/dropdown/dropdown.scss	Added `.dropdown-popover` z-index styling
frontend/app/components/shared/types/tanstack.ts	Added `COMMUNITY_MENTIONS` query key
frontend/app/components/shared/types/routes.ts	Added route names for community voice pages
frontend/app/components/modules/widget/types/widget-area.ts	Added `COMMUNITY` widget area
frontend/app/components/modules/widget/config/widget-area.config.ts	Added configuration for community widget area
frontend/app/components/modules/project/config/sentiments.ts	New sentiment configuration for filtering (positive, neutral, negative)
frontend/app/components/modules/project/config/links.ts	Added community voice navigation link configuration
frontend/app/components/modules/project/config/youtube.config.ts	YouTube platform configuration for community mentions
frontend/app/components/modules/project/views/community-voice.vue	Main view component for community voice with infinite scroll
frontend/public/images/platforms/youtube.png	YouTube platform logo (binary image)
frontend/public/images/platforms/x.png	X/Twitter platform logo (binary image)
frontend/public/images/platforms/reddit.svg	Reddit platform icon (SVG)
frontend/public/images/platforms/hackernews.svg	HackerNews platform icon (SVG)

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Signed-off-by: Efren Lim <[email protected]>

gaspergrom · 2025-11-21T08:02:40Z

frontend/app/components/modules/project/components/community/fragments/card-content.vue

+            />
+            <p
+              class="text-base leading-6 text-black whitespace-pre-wrap md:hidden block"
+              v-html="truncateText(mention.body, 150)"


We have function for sanitizing html
Example:
v-html="sanitize(config.description(project))"

gaspergrom · 2025-11-21T08:03:59Z

frontend/app/components/modules/project/components/community/fragments/card-content.vue

+          v-if="mention.imageUrl && isValidUrl(mention.imageUrl)"
+          :src="mention.imageUrl"
+          alt=""
+          class="w-full lg:w-[200px] lg:h-[100px] h-[120px] object-cover rounded-lg shrink-0"


dont use 200px etc put values into tailwind config and then use them

gaspergrom · 2025-11-21T08:04:54Z

frontend/app/components/modules/project/components/community/fragments/platform-filter.vue

+                v-if="item.image"
+                :src="item.image"
+                :alt="item.label"
+                class="w-[15px] h-[15px] object-contain"


round to 16px and use w-4 h-4

gaspergrom · 2025-11-21T08:05:06Z

frontend/app/components/modules/project/components/community/fragments/selected-chips.vue

+    <div
+      v-for="item in displayedItems"
+      :key="item.value"
+      class="bg-neutral-100 rounded-full px-1.5 py-0.5 flex items-center gap-1 min-w-0 max-w-[200px]"


dont use static values

gaspergrom · 2025-11-21T08:05:17Z

frontend/app/components/modules/project/components/community/fragments/sentiment-icon.vue

+      :class="sentimentTextColor"
+    />
+    <div
+      class="flex-1 w-0.5 min-h-[20px]"


gaspergrom · 2025-11-21T08:06:02Z

...tend/app/components/modules/project/components/community/sections/community-filter-modal.vue

+    v-model="isCommunityFilterOpen"
+    class="p-6"
+  >
+    <section class="flex flex-col h-[calc(100vh-160px)]">


i think we have type of modal which does that height and makes it full screen with paddings check type attribute on modal

gaspergrom · 2025-11-21T08:06:21Z

frontend/app/components/modules/project/components/community/sections/filter-area.vue

+-->
+<template>
+  <div
+    class="flex flex-col gap-5 sticky lg:top-[15rem] top-[13rem]"


put values into tailwind config

gaspergrom · 2025-11-21T08:06:46Z

frontend/app/components/uikit/dropdown/dropdown.scss

 }

+.dropdown-popover.c-popover__content {
+  @apply z-[9];


you can just do z-index: 9
no need for tailwind if you use fixed value

gaspergrom · 2025-11-21T08:08:51Z

frontend/app/pages/project/[slug]/repository-group/[groupSlug]/community-voice.vue

+useSeoMeta({
+  robots: 'noindex, nofollow',


Community voice is project only so i dont think its needed to be there for repository groups and repositories. Check with jonathan if we hide it when users are filtering

gaspergrom · 2025-11-21T08:18:57Z

For sentiments filter you are sending wrong values they should be capitalized like we have in the database. Check data you get returned to match the valuse

Signed-off-by: Efren Lim <[email protected]>

Signed-off-by: Gašper Grom <[email protected]>

emlimlf added 17 commits November 18, 2025 15:54

chore: partial work for community voice ui

9b66e0f

Signed-off-by: Efren Lim <[email protected]>

chore: changed the config file

4c2851d

Signed-off-by: Efren Lim <[email protected]>

chore: fix lint errors

98d673e

Signed-off-by: Efren Lim <[email protected]>

chore: partial work for community voice ui

ab7b535

Signed-off-by: Efren Lim <[email protected]>

chore: changed the config file

afb375e

Signed-off-by: Efren Lim <[email protected]>

chore: fix lint errors

0f0f568

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'feat/community-voice-ui' of github.com:linuxfoundation/…

b514322

…insights into feat/community-voice-ui

chore: added sample filter controls

64220c5

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

19f7cc8

fix: card header styling and added github card

0635570

Signed-off-by: Efren Lim <[email protected]>

chore: set filter values to data available in the project

601abaf

Signed-off-by: Efren Lim <[email protected]>

fix: merge conflict and added pagination

0ba22a6

Signed-off-by: Efren Lim <[email protected]>

chore: hide filters on mobile view

c223064

Signed-off-by: Efren Lim <[email protected]>

chore: implemented community filter modal for mobile

f6e1458

Signed-off-by: Efren Lim <[email protected]>

feat: added filter count display

f3ac6c8

Signed-off-by: Efren Lim <[email protected]>

feat: card display mobile view

6a19d1d

Signed-off-by: Efren Lim <[email protected]>

fix: tablet to lg size responsive

1dd3a8f

Signed-off-by: Efren Lim <[email protected]>

emlimlf requested review from Copilot and gaspergrom and removed request for Copilot November 21, 2025 05:43

github-actions bot reviewed Nov 21, 2025

View reviewed changes

Merge branch 'main' into feat/community-voice-ui

87cbb17

Copilot started reviewing on behalf of emlimlf November 21, 2025 05:43 View session

Copilot finished reviewing on behalf of emlimlf November 21, 2025 05:44

chore: add no index meta seo

33bb116

Signed-off-by: Efren Lim <[email protected]>

Copilot AI review requested due to automatic review settings November 21, 2025 05:48

Copilot started reviewing on behalf of emlimlf November 21, 2025 05:48 View session

Copilot finished reviewing on behalf of emlimlf November 21, 2025 05:49

Copilot AI reviewed Nov 21, 2025

View reviewed changes

fix: word break for xl screens

f821e8d

Signed-off-by: Efren Lim <[email protected]>

emlimlf changed the title ~~Feat/community voice UI~~ feat: community voice UI Nov 21, 2025

emlimlf added 4 commits November 21, 2025 13:56

fix: prettier issue

6ab8514

Signed-off-by: Efren Lim <[email protected]>

fix: card content display for html

3166b14

Signed-off-by: Efren Lim <[email protected]>

chore: add empty state

3649ec0

Signed-off-by: Efren Lim <[email protected]>

fix: make whole card clickable

6e3c1ab

Signed-off-by: Efren Lim <[email protected]>

gaspergrom requested changes Nov 21, 2025

View reviewed changes

emlimlf and others added 2 commits November 21, 2025 17:11

fix: pr comments

40cef38

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

ac10ae5

emlimlf requested a review from gaspergrom November 21, 2025 09:11

gaspergrom approved these changes Nov 21, 2025

View reviewed changes

emlimlf and others added 9 commits November 21, 2025 19:58

chore: more UI fixes

83a1eaa

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

d1bb0d8

chore: added check for user email

41db42b

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

ff29d86

chore: added powered by octolens text

9858b7a

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

714bff8

chore: make the sentiment line responsive based on the content

9ddf042

Signed-off-by: Efren Lim <[email protected]>

Merge branch 'main' into feat/community-voice-ui

a9ddfff

feat: protect endpoint

6bcf88c

Signed-off-by: Gašper Grom <[email protected]>

emlimlf merged commit b3968be into main Nov 27, 2025
9 checks passed

emlimlf deleted the feat/community-voice-ui branch November 27, 2025 09:36

feat: community voice UI #1426

feat: community voice UI #1426

Conversation

emlimlf commented Nov 21, 2025 • edited by atlassian bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

In this PR

Ticket

Uh oh!

github-actions bot left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

gaspergrom commented Nov 21, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

emlimlf commented Nov 21, 2025 •

edited by atlassian bot

Loading

github-actions bot left a comment •

edited

Loading