fix: redirect the 'Request' button to the right page (#1711)

This PR change the link of the 'Request' button of the UserDropdown for user with no MANAGE_REQUEST
or REQUEST_VIEW permissions. These users can't see the /users/:ID/requests page, so there were
redirected to the home page. This PR also removes the /profile/request page which is the same as the
/request or the /users/:ID/requests page.

fix #1588

src/components/Layout/UserDropdown/index.tsx

@@ -1,6 +1,6 @@
 import CachedImage from '@app/components/Common/CachedImage';
 import MiniQuotaDisplay from '@app/components/Layout/UserDropdown/MiniQuotaDisplay';
-import { useUser } from '@app/hooks/useUser';
+import { Permission, useUser } from '@app/hooks/useUser';
 import defineMessages from '@app/utils/defineMessages';
 import { Menu, Transition } from '@headlessui/react';
 import {
@@ -36,7 +36,7 @@ ForwardedLink.displayName = 'ForwardedLink';
 
 const UserDropdown = () => {
   const intl = useIntl();
-  const { user, revalidate } = useUser();
+  const { user, revalidate, hasPermission } = useUser();
 
   const logout = async () => {
     const response = await axios.post('/api/v1/auth/logout');
@@ -118,7 +118,14 @@ const UserDropdown = () => {
               <Menu.Item>
                 {({ active }) => (
                   <ForwardedLink
-                    href={`/users/${user?.id}/requests?filter=all`}
+                    href={
+                      hasPermission(
+                        [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
+                        { type: 'or' }
+                      )
+                        ? `/users/${user?.id}/requests?filter=all`
+                        : '/requests'
+                    }
                     className={`flex items-center rounded px-4 py-2 text-sm font-medium text-gray-200 transition duration-150 ease-in-out ${
                       active
                         ? 'bg-gradient-to-br from-indigo-600 to-purple-600 text-white'

src/components/UserProfile/index.tsx

@@ -160,9 +160,12 @@ const UserProfile = () => {
                 <dd className="mt-1 text-3xl font-semibold text-white">
                   <Link
                     href={
-                      user.id === currentUser?.id
+                      currentHasPermission(
-                        ? '/profile/requests?filter=all'
+                        [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
-                        : `/users/${user?.id}/requests?filter=all`
+                        { type: 'or' }
+                      )
+                        ? `/users/${user?.id}/requests?filter=all`
+                        : '/requests'
                     }
                   >
                     {intl.formatNumber(user.requestCount)}
@@ -293,9 +296,12 @@ const UserProfile = () => {
             <div className="slider-header">
               <Link
                 href={
-                  user.id === currentUser?.id
+                  currentHasPermission(
-                    ? '/profile/requests?filter=all'
+                    [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
-                    : `/users/${user?.id}/requests?filter=all`
+                    { type: 'or' }
+                  )
+                    ? `/users/${user?.id}/requests?filter=all`
+                    : '/requests'
                 }
                 className="slider-title"
               >

src/pages/profile/requests.tsx

@@ -1,8 +0,0 @@
-import RequestList from '@app/components/RequestList';
-import type { NextPage } from 'next';
-
-const UserRequestsPage: NextPage = () => {
-  return <RequestList />;
-};
-
-export default UserRequestsPage;