yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-12-14 08:44:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

PR feedback fixes

Browse Source
This commit is contained in:
ronronscelestes 2021-08-20 15:09:29 +02:00
parent e9fb65d1ea
commit 5d05c84e3e
1 changed files with 88 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

156
packages/plugins/users-permissions/admin/src/pages/Providers/index.js
View File

@ -1,8 +1,5 @@
import React, { useCallback, useMemo, useRef, useState } from 'react'; import React, { useCallback, useMemo, useRef, useState } from 'react';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
// import { Header, List } from '@buffetjs/custom';
// import { Text } from '@buffetjs/core';
// import { Pencil } from '@buffetjs/icons';
import { import {
SettingsPageTitle, SettingsPageTitle,
SizedInput, SizedInput,
@ -11,11 +8,12 @@ import {
request, request,
useNotification, useNotification,
useOverlayBlocker, useOverlayBlocker,
LoadingIndicatorPage
} from '@strapi/helper-plugin'; } from '@strapi/helper-plugin';
import { get, upperFirst, has } from 'lodash'; import { get, upperFirst, has } from 'lodash';
import { Row } from 'reactstrap'; import { Row } from 'reactstrap';
// import ListBaselineAlignment from '../../components/ListBaselineAlignment';
// import ListRow from '../../components/ListRow';
// DS INTEGRATION // DS INTEGRATION
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@ -49,7 +47,6 @@ const ProvidersPage = () => {
const updatePermissions = useMemo(() => { const updatePermissions = useMemo(() => {
return { update: pluginPermissions.updateProviders }; return { update: pluginPermissions.updateProviders };
}, []); }, []);
console.log(updatePermissions);
const { const {
allowedActions: { canUpdate }, allowedActions: { canUpdate },
@ -58,8 +55,8 @@ const ProvidersPage = () => {
dispatchSubmitSucceeded, dispatchSubmitSucceeded,
formErrors, formErrors,
handleChange, handleChange,
// isLoading, isLoading,
// isLoadingForPermissions, isLoadingForPermissions,
modifiedData, modifiedData,
} = useForm('providers', updatePermissions); } = useForm('providers', updatePermissions);
@ -186,67 +183,87 @@ const ProvidersPage = () => {
<HeaderLayout <HeaderLayout
as="h1" as="h1"
id="providers" id="providers"
title={formatMessage({ id: getTrad('HeaderNav.link.providers') })} title={formatMessage({
id: getTrad('HeaderNav.link.providers'),
defaultMessage: 'Providers',
})}
/> />
<ContentLayout> {isLoading || isLoadingForPermissions ? (
<Table colCount={4} rowCount={rowCount + 1}> <LoadingIndicatorPage />
<Thead> ) : (
<Tr> <ContentLayout>
<Th> <Table colCount={4} rowCount={rowCount + 1}>
<TableLabel> <Thead>
<VisuallyHidden> <Tr>
{formatMessage({ id: getTrad('Providers.image') })} <Th>
</VisuallyHidden> <TableLabel>
</TableLabel> <VisuallyHidden>
</Th> {formatMessage({ id: getTrad('Providers.image'), defaultMessage: 'Image' })}
<Th> </VisuallyHidden>
<TableLabel>{formatMessage({ id: getTrad('Providers.name') })}</TableLabel> </TableLabel>
</Th> </Th>
<Th> <Th>
<TableLabel>{formatMessage({ id: getTrad('Providers.status') })}</TableLabel> <TableLabel>
</Th> {formatMessage({ id: getTrad('Providers.name'), defaultMessage: 'Name' })}
<Th> </TableLabel>
<TableLabel> </Th>
<VisuallyHidden> <Th>
{formatMessage({ id: getTrad('Providers.settings') })} <TableLabel>
</VisuallyHidden> {formatMessage({ id: getTrad('Providers.status'), defaultMessage: 'Status' })}
</TableLabel> </TableLabel>
</Th> </Th>
</Tr> <Th>
</Thead> <TableLabel>
<Tbody> <VisuallyHidden>
{providers.map(provider => ( {formatMessage({
<Tr key={provider.name}> id: getTrad('Providers.settings'),
<Td width=""> defaultMessage: 'Settings',
<FontAwesomeIcon icon={provider.icon} /> })}
</Td> </VisuallyHidden>
<Td width="45%"> </TableLabel>
<Text highlighted textColor="neutral800"> </Th>
{provider.name}
</Text>
</Td>
<Td width="65%">
<Text textColor={provider.enabled ? 'success600' : 'danger600'}>
{provider.enabled
? formatMessage({ id: getTrad('Providers.enabled') })
: formatMessage({ id: getTrad('Providers.disabled') })}
</Text>
</Td>
<Td>
{canUpdate && (
<IconButton
onClick={() => handleClickEdit(provider)}
noBorder
icon={<EditIcon />}
label="Edit"
/>
)}
</Td>
</Tr> </Tr>
))} </Thead>
</Tbody> <Tbody>
</Table> {providers.map(provider => (
</ContentLayout> <Tr key={provider.name}>
<Td width="">
<FontAwesomeIcon icon={provider.icon} />
</Td>
<Td width="45%">
<Text highlighted textColor="neutral800">
{provider.name}
</Text>
</Td>
<Td width="65%">
<Text textColor={provider.enabled ? 'success600' : 'danger600'}>
{provider.enabled
? formatMessage({
id: getTrad('Providers.enabled'),
defaultMessage: 'Enabled',
})
: formatMessage({
id: getTrad('Providers.disabled'),
defaultMessage: 'Disabled',
})}
</Text>
</Td>
<Td>
{canUpdate && (
<IconButton
onClick={() => handleClickEdit(provider)}
noBorder
icon={<EditIcon />}
label="Edit"
/>
)}
</Td>
</Tr>
))}
</Tbody>
</Table>
</ContentLayout>
)}
</Main> </Main>
<ModalForm <ModalForm
isOpen={isOpen} isOpen={isOpen}
@ -257,7 +274,10 @@ const ProvidersPage = () => {
onClosed={handleClosed} onClosed={handleClosed}
onToggle={handleToggle} onToggle={handleToggle}
headerBreadcrumbs={[ headerBreadcrumbs={[
getTrad('PopUpForm.header.edit.providers'), formatMessage({
id: getTrad('PopUpForm.header.edit.providers'),
defaultMessage: 'Edit Provider',
}),
upperFirst(providerToEditName), upperFirst(providerToEditName),
]} ]}
> >