Added url for user and issue on project detail page (#941)

* ui: url for user and issue on project detail page Signed-off-by: Akash Jaiswal <akashjaiswal3846@gmail.com> * fix: in dark mode Signed-off-by: Akash Jaiswal <akashjaiswal3846@gmail.com> * fix: username of user if name is missing Signed-off-by: Akash Jaiswal <akashjaiswal3846@gmail.com> --------- Signed-off-by: Akash Jaiswal <akashjaiswal3846@gmail.com>
OWASP · Feb 28, 2025 · 6b35f69 · 6b35f69
1 parent 3f167d4
commit 6b35f69
Show file tree

Hide file tree

Showing 7 changed files with 20 additions and 4 deletions.
diff --git a/backend/apps/github/graphql/nodes/issue.py b/backend/apps/github/graphql/nodes/issue.py
@@ -13,6 +13,7 @@ class Meta:
             "author",
             "comments_count",
             "created_at",
+            "url",
             "number",
             "state",
             "title",

diff --git a/backend/tests/github/graphql/nodes/issue_test.py b/backend/tests/github/graphql/nodes/issue_test.py
@@ -21,6 +21,7 @@ def test_meta_configuration(self):
             "created_at",
             "number",
             "state",
+            "url",
             "title",
         }
         assert set(IssueNode._meta.fields) == expected_fields
diff --git a/frontend/__tests__/e2e/data/mockHomeData.ts b/frontend/__tests__/e2e/data/mockHomeData.ts
@@ -128,6 +128,7 @@ export const mockHomeData = {
         author: {
           avatarUrl: '/~https://avatars.githubusercontent.com/u/1?v=4',
           name: 'Author 1',
+          url: '/~https://github.com/arkid15r',
           __typename: 'UserNode',
         },
         __typename: 'IssueNode',
@@ -140,6 +141,7 @@ export const mockHomeData = {
         author: {
           avatarUrl: '/~https://avatars.githubusercontent.com/u/2?v=4',
           name: 'Author 2',
+          url: '/~https://github.com/arkid15r',
           __typename: 'UserNode',
         },
         __typename: 'IssueNode',

diff --git a/frontend/__tests__/unit/data/mockHomeData.ts b/frontend/__tests__/unit/data/mockHomeData.ts
@@ -39,6 +39,7 @@ export const mockGraphQLData = {
       title: 'Documentation : Project Setup Documentation Update',
       author: {
         avatarUrl: '/~https://avatars.githubusercontent.com/u/134638667?v=4',
+        url: '/~https://github.com/arkid15r',
         name: 'Raj gupta',
       },
     },

diff --git a/frontend/__tests__/unit/data/mockProjectDetailsData.ts b/frontend/__tests__/unit/data/mockProjectDetailsData.ts
@@ -43,6 +43,7 @@ export const mockProjectDetailsData = {
         author: {
           avatarUrl: 'https://example.com/avatar4.png',
           login: 'dave_debugger',
+          url: '/~https://github.com/arkid15r',
           name: 'Dave Debugger',
         },
       },

diff --git a/frontend/src/api/queries/homeQueries.ts b/frontend/src/api/queries/homeQueries.ts
@@ -33,9 +33,12 @@ export const GET_MAIN_PAGE_DATA = gql`
       createdAt
       number
       title
+      url
       author {
         avatarUrl
+        login
         name
+        url
       }
     }
     recentReleases(limit: 5) {

diff --git a/frontend/src/components/ItemCardList.tsx b/frontend/src/components/ItemCardList.tsx
@@ -22,18 +22,25 @@ const ItemCardList = ({
         {data.map((item, index) => (
           <div key={index} className="mb-4 rounded-lg bg-gray-200 p-4 dark:bg-gray-700">
             <h3 className="overflow-hidden text-ellipsis whitespace-nowrap font-semibold">
-              {item.title || item.name}
+              <a href={item?.url} className="text-blue-500 hover:underline dark:text-blue-400">
+                {item.title || item.name}
+              </a>
             </h3>
             <div className="flex flex-grow-0 flex-col justify-between lg:flex-row">
               <div className="mt-2 flex items-center">
-                {item?.author?.name && (
+                <div className="flex items-center">
                   <img
                     src={item?.author?.avatarUrl}
                     alt={item?.author?.name}
                     className="mr-2 h-6 w-6 rounded-full"
                   />
-                )}
-                <span>{item?.author?.name || item?.author?.login}</span>
+                  <a
+                    href={item?.author?.url}
+                    className="text-blue-400 hover:underline dark:text-blue-200"
+                  >
+                    {item?.author?.name || item?.author?.login}
+                  </a>
+                </div>
               </div>
               <div>{renderDetails(item)}</div>
             </div>