Move login as logic to the user usage table

Author: erikao1998

src/client/components/Admin/Usage/UserTable.tsx

@@ -15,7 +15,7 @@ import {
 import { enqueueSnackbar } from 'notistack'
 import { useTranslation } from 'react-i18next'
 
-import { ChatInstanceUsage, ChatInstance } from '../../../types'
+import { ChatInstanceUsage, ChatInstance, User } from '../../../types'
 import useChatInstanceUsage from '../../../hooks/useChatInstanceUsage'
 import useUsers from '../../../hooks/useUsers'
 import { useDeleteChatInstanceUsageMutation } from '../../../hooks/useChatInstanceUsageMutation'
@@ -28,6 +28,11 @@ type Usage = Omit<ChatInstanceUsage, 'chatInstance'> & {
 const sortUsage = (a: Usage, b: Usage) =>
   a.user.username.localeCompare(b.user.username)
 
+const handleLoginAs = (user: User) => () => {
+  localStorage.setItem('adminLoggedInAs', user.id)
+  window.location.reload()
+}
+
 const UserTable = () => {
   const { usage: chatInstanceUsage, isLoading } = useChatInstanceUsage()
   const { users, isLoading: usersLoading } = useUsers()
@@ -136,6 +141,11 @@ const UserTable = () => {
                       {t('admin:reset')}
                     </Button>
                   </TableCell>
+                  <TableCell>
+                    <Button variant="outlined" onClick={handleLoginAs(user)}>
+                      Kirjaudu käyttäjällä
+                    </Button>
+                  </TableCell>
                 </TableRow>
               )
             )}

src/client/components/Admin/index.tsx

@@ -14,7 +14,6 @@ import { get } from 'lodash'
 import ChatInstances from './ChatInstances'
 import Usage from './Usage'
 import Updater from './Updater'
-import LoginAsSelector from './Usage/UserSearch'
 import EditTexts from './EditTexts'
 
 const stripSearch = (path: string) => path.split('?')[0]
@@ -47,11 +46,6 @@ const Admin = () => {
             to="/admin/updater"
             component={Link}
           />
-          <Tab
-            label={t('admin:searchUsers')}
-            to="/admin/search"
-            component={Link}
-          />
           <Tab
             label={t('admin:editTexts')}
             to="/admin/edit-texts"
@@ -64,7 +58,6 @@ const Admin = () => {
         <Route path="/chatinstances" element={<ChatInstances />} />
         <Route path="/usage" element={<Usage />} />
         <Route path="/updater" element={<Updater />} />
-        <Route path="/search" element={<LoginAsSelector />} />
         <Route path="/edit-texts" element={<EditTexts />} />
       </Routes>
     </Box>