Commit 81f0906e authored by Alex Kakiris's avatar Alex Kakiris
Browse files

add user providers list page

parent ce7e3a70

capif_frontend/src/configs/apiService.js

+6 −3
Changes for capif_frontend/src/configs/apiService.js: 6 added lines, 3 removed lines.
Original line number Diff line number Diff line
@@ -2,13 +2,16 @@ import axiosInstance from './axiosInstance' 
import axiosMockAdapter from 'axios-mock-adapter'

import axios from 'axios'



// INVOKERS



// GET all invokers json

export const getInvokers = async () => {

  return axiosInstance.get(`/invokers/invokersTotal`)

}



export const getMyProviders = async () => {

  const response = await axiosInstance.get('/me/providers')



  return response.data

}



// GET invokers with pagination and date order

export const getInvokersPagesOrder = async () => {

  try {

capif_frontend/src/navigation/vertical/index.js

+8 −1
Changes for capif_frontend/src/navigation/vertical/index.js: 8 added lines, 1 removed line.
Original line number Diff line number Diff line
@@ -9,11 +9,18 @@ const navigation = () => { 
    },

    {

      title: 'Invokers',

      icon: 'mdi:baseline-people',

      icon: 'mdi:account-group-outline',

      path: '/me/invokers',

      action: 'read',

      subject: 'user-area'

    },

    {

      title: 'Providers',

      icon: 'mdi:server',

      path: '/me/providers',

      action: 'read',

      subject: 'user-area'

    },

    {

      title: 'Dashboard',

      icon: 'mdi:home-outline',

capif_frontend/src/pages/me/providers/index.js

0 → 100644
+72 −0
Changes for capif_frontend/src/pages/me/providers/index.js: 72 added lines, 0 removed lines.
Original line number Diff line number Diff line 
import Box from '@mui/material/Box'

import Card from '@mui/material/Card'

import CardHeader from '@mui/material/CardHeader'

import CardContent from '@mui/material/CardContent'

import CircularProgress from '@mui/material/CircularProgress'

import Alert from '@mui/material/Alert'

import List from '@mui/material/List'

import ListItem from '@mui/material/ListItem'

import ListItemText from '@mui/material/ListItemText'

import Typography from '@mui/material/Typography'

import { useQuery } from '@tanstack/react-query'



import { getMyProviders } from 'src/configs/apiService'

import { errorMessage, retryServerErrorsOnly } from 'src/configs/queryHelpers'



const MY_PROVIDERS_KEY = ['my-providers']



const ProviderList = () => {

  const { data, isPending, isError, error } = useQuery({

    queryKey: MY_PROVIDERS_KEY,

    queryFn: getMyProviders,

    retry: retryServerErrorsOnly

  })



  // Derived during render: `data` is undefined until the first response arrives.

  const providers = data?.providers ?? []



  if (isPending) {

    return (

      <Box sx={{ display: 'flex', justifyContent: 'center', p: 4 }}>

        <CircularProgress />

      </Box>

    )

  }



  if (isError) {

    return <Alert severity='error'>{errorMessage(error, 'Could not load your providers.')}</Alert>

  }



  if (providers.length === 0) {

    return <Typography>{"You don't have a provider yet."}</Typography>

  }



  // Plain items for now: the detail page (/me/providers/[id]) comes with the publish form.

  return (

    <List>

      {providers.map(id => (

        <ListItem key={id} disableGutters>

          <ListItemText primary={id} />

        </ListItem>

      ))}

    </List>

  )

}



const MyProvidersPage = () => (

  <Box sx={{ p: 6 }}>

    <Card>

      <CardHeader title='Your providers' />

      <CardContent>

        <ProviderList />

      </CardContent>

    </Card>

  </Box>

)



MyProvidersPage.acl = {

  action: 'read',

  subject: 'user-area'

}



export default MyProvidersPage
 
 No newline at end of file