refactor: rename folder and add hover on list item

frontend/components/admin/mentions-overview/MentionsOverview.tsx → frontend/components/admin/mentions/MentionsOverview.tsx

@@ -1,10 +1,11 @@
+// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center)
 // SPDX-FileCopyrightText: 2024 Ewan Cahen (Netherlands eScience Center) <[email protected]>
 // SPDX-FileCopyrightText: 2024 Netherlands eScience Center
 //
 // SPDX-License-Identifier: Apache-2.0
 
 import {useEffect, useState} from 'react'
-import MentionsOverviewList from '~/components/admin/mentions-overview/MentionsOverviewList'
+import MentionsOverviewList from '~/components/admin/mentions/MentionsOverviewList'
 import {extractSearchTerm, SearchTermInfo} from '~/components/software/edit/mentions/utils'
 import Searchbox from '~/components/search/Searchbox'
 import Pagination from '~/components/pagination/Pagination'
@@ -21,6 +22,7 @@ export default function MentionsOverview() {
   const sanitisedSearch = sanitiseSearch(searchFor)
   useEffect(() => {
     fetchAndSetMentionList(sanitisedSearch)
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [sanitisedSearch, page, rows])
 
   function fetchAndSetMentionList(sanitisedSearch: undefined | string): void {

frontend/components/admin/mentions-overview/MentionsOverviewList.tsx → frontend/components/admin/mentions/MentionsOverviewList.tsx

@@ -1,3 +1,4 @@
+// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center)
 // SPDX-FileCopyrightText: 2024 Ewan Cahen (Netherlands eScience Center) <[email protected]>
 // SPDX-FileCopyrightText: 2024 Netherlands eScience Center
 //
@@ -57,10 +58,14 @@ export default function MentionsOverviewList({list, onUpdate}: { list: MentionIt
       <List>
         {list.map((mention, idx) => {
           return (
-            <ListItem key={mention.id} secondaryAction={
-              <IconButton onClick={() => {setModalOpen(true); setMentionToEdit(mention)}} ><EditIcon></EditIcon></IconButton>
-            }>
-              <MentionViewItem item={mention} pos={page * rows + idx + 1}></MentionViewItem>
+            <ListItem
+              key={mention.id}
+              secondaryAction={
+                <IconButton onClick={() => {setModalOpen(true); setMentionToEdit(mention)}} ><EditIcon></EditIcon></IconButton>
+              }
+              className="hover:bg-base-200 flex-1 pr-4"
+            >
+              <MentionViewItem item={mention} pos={page * rows + idx + 1} />
             </ListItem>
           )
         })}

frontend/components/mention/MentionViewItem.tsx

@@ -1,7 +1,8 @@
 // SPDX-FileCopyrightText: 2022 Dusan Mijatovic (dv4all)
 // SPDX-FileCopyrightText: 2022 dv4all
+// SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center
 // SPDX-FileCopyrightText: 2023 Ewan Cahen (Netherlands eScience Center) <[email protected]>
-// SPDX-FileCopyrightText: 2023 Netherlands eScience Center
+// SPDX-FileCopyrightText: 2024 Dusan Mijatovic (Netherlands eScience Center)
 //
 // SPDX-License-Identifier: Apache-2.0
 
@@ -54,7 +55,13 @@ export default function MentionViewItem({item, pos}: {item: MentionItemProps, po
 
   if (item?.url) {
     return (
-      <Link href={item.url} passHref target="_blank" rel="noreferrer">
+      <Link
+        href={item.url}
+        className="flex-1 pr-8"
+        target="_blank"
+        rel="noreferrer"
+        passHref
+      >
         {renderItemBody()}
       </Link>
     )

frontend/pages/admin/mentions.tsx

@@ -1,6 +1,6 @@
+// SPDX-FileCopyrightText: 2023 - 2024 Dusan Mijatovic (Netherlands eScience Center)
 // SPDX-FileCopyrightText: 2023 - 2024 Netherlands eScience Center
 // SPDX-FileCopyrightText: 2023 Christian Meeßen (GFZ) <christian[email protected]>
-// SPDX-FileCopyrightText: 2023 Dusan Mijatovic (Netherlands eScience Center)
 // SPDX-FileCopyrightText: 2023 Dusan Mijatovic (dv4all)
 // SPDX-FileCopyrightText: 2023 Helmholtz Centre Potsdam - GFZ German Research Centre for Geosciences
 // SPDX-FileCopyrightText: 2023 dv4all
@@ -14,7 +14,7 @@ import {app} from '../../config/app'
 import DefaultLayout from '~/components/layout/DefaultLayout'
 import AdminPageWithNav from '~/components/admin/AdminPageWithNav'
 import {adminPages} from '~/components/admin/AdminNav'
-import MentionsOverview from '~/components/admin/mentions-overview/MentionsOverview'
+import MentionsOverview from '~/components/admin/mentions/MentionsOverview'
 import {SearchProvider} from '~/components/search/SearchContext'
 import {PaginationProvider} from '~/components/pagination/PaginationContext'