@strapi/plugin-users-permissions 0.0.0-next.e41415e8ff5f565ff959667d5c5ba4f20bee013c → 0.0.0-next.e5b87a54008c9de2b3286a4774635dcf69895d9b

package/admin/src/pages/Providers/index.js

@@ -1,272 +0,0 @@
-import React, { useMemo, useRef, useState } from 'react';
-import { useIntl } from 'react-intl';
-import {
-  SettingsPageTitle,
-  LoadingIndicatorPage,
-  useTracking,
-  useNotification,
-  useOverlayBlocker,
-  CheckPagePermissions,
-  useRBAC,
-  useFocusWhenNavigate,
-  onRowClick,
-  stopPropagation,
-} from '@strapi/helper-plugin';
-import has from 'lodash/has';
-import upperFirst from 'lodash/upperFirst';
-import {
-  HeaderLayout,
-  Layout,
-  ContentLayout,
-  Main,
-  useNotifyAT,
-  Table,
-  Thead,
-  Tr,
-  Th,
-  Tbody,
-  Td,
-  Typography,
-  IconButton,
-  VisuallyHidden,
-} from '@strapi/design-system';
-import { Pencil } from '@strapi/icons';
-import { useQuery, useMutation, useQueryClient } from 'react-query';
-import forms from './utils/forms';
-import { fetchData, putProvider } from './utils/api';
-import createProvidersArray from './utils/createProvidersArray';
-import { getTrad } from '../../utils';
-import pluginPermissions from '../../permissions';
-import FormModal from '../../components/FormModal';
-
-export const ProvidersPage = () => {
-  const { formatMessage } = useIntl();
-  useFocusWhenNavigate();
-  const { notifyStatus } = useNotifyAT();
-  const queryClient = useQueryClient();
-  const { trackUsage } = useTracking();
-  const trackUsageRef = useRef(trackUsage);
-  const [isOpen, setIsOpen] = useState(false);
-  const [isSubmiting, setIsSubmiting] = useState(false);
-  const [providerToEditName, setProviderToEditName] = useState(null);
-  const toggleNotification = useNotification();
-  const { lockApp, unlockApp } = useOverlayBlocker();
-
-  const updatePermissions = useMemo(() => {
-    return { update: pluginPermissions.updateProviders };
-  }, []);
-
-  const {
-    isLoading: isLoadingForPermissions,
-    allowedActions: { canUpdate },
-  } = useRBAC(updatePermissions);
-
-  const {
-    isLoading: isLoadingForData,
-    data: modifiedData,
-    isFetching,
-  } = useQuery('get-providers', () => fetchData(toggleNotification), {
-    onSuccess() {
-      notifyStatus(
-        formatMessage({
-          id: getTrad('Providers.data.loaded'),
-          defaultMessage: 'Providers have been loaded',
-        })
-      );
-    },
-    initialData: {},
-  });
-
-  const isLoading = isLoadingForData || isFetching;
-
-  const submitMutation = useMutation(putProvider, {
-    async onSuccess() {
-      await queryClient.invalidateQueries('get-providers');
-      toggleNotification({
-        type: 'info',
-        message: { id: getTrad('notification.success.submit') },
-      });
-
-      trackUsageRef.current('didEditAuthenticationProvider');
-      setIsSubmiting(false);
-      handleToggleModal();
-      unlockApp();
-    },
-    onError() {
-      toggleNotification({
-        type: 'warning',
-        message: { id: 'notification.error' },
-      });
-      unlockApp();
-      setIsSubmiting(false);
-    },
-    refetchActive: false,
-  });
-
-  const providers = useMemo(() => createProvidersArray(modifiedData), [modifiedData]);
-
-  const rowCount = providers.length;
-
-  const isProviderWithSubdomain = useMemo(() => {
-    if (!providerToEditName) {
-      return false;
-    }
-
-    const providerToEdit = providers.find((obj) => obj.name === providerToEditName);
-
-    return has(providerToEdit, 'subdomain');
-  }, [providers, providerToEditName]);
-
-  const pageTitle = formatMessage({
-    id: getTrad('HeaderNav.link.providers'),
-    defaultMessage: 'Providers',
-  });
-
-  const layoutToRender = useMemo(() => {
-    if (providerToEditName === 'email') {
-      return forms.email;
-    }
-
-    if (isProviderWithSubdomain) {
-      return forms.providersWithSubdomain;
-    }
-
-    return forms.providers;
-  }, [providerToEditName, isProviderWithSubdomain]);
-
-  const handleToggleModal = () => {
-    setIsOpen((prev) => !prev);
-  };
-
-  const handleClickEdit = (provider) => {
-    if (canUpdate) {
-      setProviderToEditName(provider.name);
-      handleToggleModal();
-    }
-  };
-
-  const handleSubmit = async (values) => {
-    setIsSubmiting(true);
-
-    lockApp();
-
-    trackUsageRef.current('willEditAuthenticationProvider');
-
-    const body = { ...modifiedData, [providerToEditName]: values };
-
-    submitMutation.mutate({ providers: body });
-  };
-
-  return (
-    <Layout>
-      <SettingsPageTitle name={pageTitle} />
-      <Main>
-        <HeaderLayout
-          title={formatMessage({
-            id: getTrad('HeaderNav.link.providers'),
-            defaultMessage: 'Providers',
-          })}
-        />
-        {isLoading || isLoadingForPermissions ? (
-          <LoadingIndicatorPage />
-        ) : (
-          <ContentLayout>
-            <Table colCount={3} rowCount={rowCount + 1}>
-              <Thead>
-                <Tr>
-                  <Th>
-                    <Typography variant="sigma" textColor="neutral600">
-                      {formatMessage({ id: 'global.name', defaultMessage: 'Name' })}
-                    </Typography>
-                  </Th>
-                  <Th>
-                    <Typography variant="sigma" textColor="neutral600">
-                      {formatMessage({ id: getTrad('Providers.status'), defaultMessage: 'Status' })}
-                    </Typography>
-                  </Th>
-                  <Th>
-                    <Typography variant="sigma">
-                      <VisuallyHidden>
-                        {formatMessage({
-                          id: 'global.settings',
-                          defaultMessage: 'Settings',
-                        })}
-                      </VisuallyHidden>
-                    </Typography>
-                  </Th>
-                </Tr>
-              </Thead>
-              <Tbody>
-                {providers.map((provider) => (
-                  <Tr
-                    key={provider.name}
-                    {...onRowClick({
-                      fn: () => handleClickEdit(provider),
-                      condition: canUpdate,
-                    })}
-                  >
-                    <Td width="45%">
-                      <Typography fontWeight="semiBold" textColor="neutral800">
-                        {provider.name}
-                      </Typography>
-                    </Td>
-                    <Td width="65%">
-                      <Typography
-                        textColor={provider.enabled ? 'success600' : 'danger600'}
-                        data-testid={`enable-${provider.name}`}
-                      >
-                        {provider.enabled
-                          ? formatMessage({
-                              id: 'global.enabled',
-                              defaultMessage: 'Enabled',
-                            })
-                          : formatMessage({
-                              id: 'global.disabled',
-                              defaultMessage: 'Disabled',
-                            })}
-                      </Typography>
-                    </Td>
-                    <Td {...stopPropagation}>
-                      {canUpdate && (
-                        <IconButton
-                          onClick={() => handleClickEdit(provider)}
-                          noBorder
-                          icon={<Pencil />}
-                          label="Edit"
-                        />
-                      )}
-                    </Td>
-                  </Tr>
-                ))}
-              </Tbody>
-            </Table>
-          </ContentLayout>
-        )}
-      </Main>
-      <FormModal
-        initialData={modifiedData[providerToEditName]}
-        isOpen={isOpen}
-        isSubmiting={isSubmiting}
-        layout={layoutToRender}
-        headerBreadcrumbs={[
-          formatMessage({
-            id: getTrad('PopUpForm.header.edit.providers'),
-            defaultMessage: 'Edit Provider',
-          }),
-          upperFirst(providerToEditName),
-        ]}
-        onToggle={handleToggleModal}
-        onSubmit={handleSubmit}
-        providerToEditName={providerToEditName}
-      />
-    </Layout>
-  );
-};
-
-const ProtectedProvidersPage = () => (
-  <CheckPagePermissions permissions={pluginPermissions.readProviders}>
-    <ProvidersPage />
-  </CheckPagePermissions>
-);
-
-export default ProtectedProvidersPage;

package/admin/src/pages/Providers/reducer.js

@@ -1,54 +0,0 @@
-import produce from 'immer';
-import set from 'lodash/set';
-
-const initialState = {
-  formErrors: {},
-  isLoading: true,
-  initialData: {},
-  modifiedData: {},
-};
-
-const reducer = (state, action) =>
-  // eslint-disable-next-line consistent-return
-  produce(state, (draftState) => {
-    switch (action.type) {
-      case 'GET_DATA': {
-        draftState.isLoading = true;
-        draftState.initialData = {};
-        draftState.modifiedData = {};
-
-        break;
-      }
-
-      case 'GET_DATA_SUCCEEDED': {
-        draftState.isLoading = false;
-        draftState.initialData = action.data;
-        draftState.modifiedData = action.data;
-
-        break;
-      }
-      case 'GET_DATA_ERROR': {
-        draftState.isLoading = true;
-        break;
-      }
-      case 'ON_CHANGE': {
-        set(draftState, ['modifiedData', ...action.keys.split('.')], action.value);
-        break;
-      }
-      case 'RESET_FORM': {
-        draftState.modifiedData = state.initialData;
-        draftState.formErrors = {};
-        break;
-      }
-      case 'SET_ERRORS': {
-        draftState.formErrors = action.errors;
-        break;
-      }
-      default: {
-        return draftState;
-      }
-    }
-  });
-
-export default reducer;
-export { initialState };

package/admin/src/pages/Providers/utils/api.js

@@ -1,25 +0,0 @@
-import { getFetchClient } from '@strapi/helper-plugin';
-import { getRequestURL } from '../../../utils';
-
-// eslint-disable-next-line import/prefer-default-export
-export const fetchData = async (toggleNotification) => {
-  try {
-    const { get } = getFetchClient();
-    const { data } = await get(getRequestURL('providers'));
-
-    return data;
-  } catch (err) {
-    toggleNotification({
-      type: 'warning',
-      message: { id: 'notification.error' },
-    });
-
-    throw new Error('error');
-  }
-};
-
-export const putProvider = (body) => {
-  const { put } = getFetchClient();
-
-  return put(getRequestURL('providers'), body);
-};

package/admin/src/pages/Providers/utils/createProvidersArray.js

@@ -1,21 +0,0 @@
-import sortBy from 'lodash/sortBy';
-
-const createProvidersArray = (data) => {
-  return sortBy(
-    Object.keys(data).reduce((acc, current) => {
-      const { icon: iconName, enabled, subdomain } = data[current];
-      const icon = iconName === 'envelope' ? ['fas', 'envelope'] : ['fab', iconName];
-
-      if (subdomain !== undefined) {
-        acc.push({ name: current, icon, enabled, subdomain });
-      } else {
-        acc.push({ name: current, icon, enabled });
-      }
-
-      return acc;
-    }, []),
-    'name'
-  );
-};
-
-export default createProvidersArray;

package/admin/src/pages/Roles/CreatePage/index.js

@@ -1,182 +0,0 @@
-import React, { useState, useRef } from 'react';
-import { useHistory } from 'react-router-dom';
-import {
-  ContentLayout,
-  HeaderLayout,
-  Main,
-  Button,
-  Flex,
-  Box,
-  TextInput,
-  Textarea,
-  Typography,
-  GridItem,
-  Grid,
-} from '@strapi/design-system';
-import { Check } from '@strapi/icons';
-import { Formik } from 'formik';
-import { useIntl } from 'react-intl';
-import {
-  useOverlayBlocker,
-  SettingsPageTitle,
-  useFetchClient,
-  useTracking,
-  Form,
-  useNotification,
-} from '@strapi/helper-plugin';
-import UsersPermissions from '../../../components/UsersPermissions';
-import getTrad from '../../../utils/getTrad';
-import pluginId from '../../../pluginId';
-import { usePlugins } from '../../../hooks';
-import schema from './utils/schema';
-
-const EditPage = () => {
-  const { formatMessage } = useIntl();
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  const toggleNotification = useNotification();
-  const { goBack } = useHistory();
-  const { lockApp, unlockApp } = useOverlayBlocker();
-  const { isLoading: isLoadingPlugins, permissions, routes } = usePlugins();
-  const { trackUsage } = useTracking();
-  const permissionsRef = useRef();
-  const { post } = useFetchClient();
-
-  const handleCreateRoleSubmit = async (data) => {
-    // Set loading state
-    lockApp();
-    setIsSubmitting(true);
-    try {
-      const permissions = permissionsRef.current.getPermissions();
-      // Update role in Strapi
-      await post(`/${pluginId}/roles`, { ...data, ...permissions, users: [] });
-      // Notify success
-      trackUsage('didCreateRole');
-      toggleNotification({
-        type: 'success',
-        message: {
-          id: getTrad('Settings.roles.created'),
-          defaultMessage: 'Role created',
-        },
-      });
-      // Forcing redirecting since we don't have the id in the response
-      goBack();
-    } catch (err) {
-      console.error(err);
-      toggleNotification({
-        type: 'warning',
-        message: {
-          id: 'notification.error',
-          defaultMessage: 'An error occurred',
-        },
-      });
-    }
-    // Unset loading state
-    setIsSubmitting(false);
-    unlockApp();
-  };
-
-  return (
-    <Main>
-      <SettingsPageTitle name="Roles" />
-      <Formik
-        enableReinitialize
-        initialValues={{ name: '', description: '' }}
-        onSubmit={handleCreateRoleSubmit}
-        validationSchema={schema}
-      >
-        {({ handleSubmit, values, handleChange, errors }) => (
-          <Form noValidate onSubmit={handleSubmit}>
-            <HeaderLayout
-              primaryAction={
-                !isLoadingPlugins && (
-                  <Button type="submit" loading={isSubmitting} startIcon={<Check />}>
-                    {formatMessage({
-                      id: 'global.save',
-                      defaultMessage: 'Save',
-                    })}
-                  </Button>
-                )
-              }
-              title={formatMessage({
-                id: 'Settings.roles.create.title',
-                defaultMessage: 'Create a role',
-              })}
-              subtitle={formatMessage({
-                id: 'Settings.roles.create.description',
-                defaultMessage: 'Define the rights given to the role',
-              })}
-            />
-            <ContentLayout>
-              <Flex direction="column" alignItems="stretch" gap={7}>
-                <Box
-                  background="neutral0"
-                  hasRadius
-                  shadow="filterShadow"
-                  paddingTop={6}
-                  paddingBottom={6}
-                  paddingLeft={7}
-                  paddingRight={7}
-                >
-                  <Flex direction="column" alignItems="stretch" gap={4}>
-                    <Typography variant="delta" as="h2">
-                      {formatMessage({
-                        id: getTrad('EditPage.form.roles'),
-                        defaultMessage: 'Role details',
-                      })}
-                    </Typography>
-                    <Grid gap={4}>
-                      <GridItem col={6}>
-                        <TextInput
-                          name="name"
-                          value={values.name || ''}
-                          onChange={handleChange}
-                          label={formatMessage({
-                            id: 'global.name',
-                            defaultMessage: 'Name',
-                          })}
-                          error={
-                            errors.name
-                              ? formatMessage({ id: errors.name, defaultMessage: 'Invalid value' })
-                              : null
-                          }
-                        />
-                      </GridItem>
-                      <GridItem col={6}>
-                        <Textarea
-                          id="description"
-                          value={values.description || ''}
-                          onChange={handleChange}
-                          label={formatMessage({
-                            id: 'global.description',
-                            defaultMessage: 'Description',
-                          })}
-                          error={
-                            errors.description
-                              ? formatMessage({
-                                  id: errors.description,
-                                  defaultMessage: 'Invalid value',
-                                })
-                              : null
-                          }
-                        />
-                      </GridItem>
-                    </Grid>
-                  </Flex>
-                </Box>
-                {!isLoadingPlugins && (
-                  <UsersPermissions
-                    ref={permissionsRef}
-                    permissions={permissions}
-                    routes={routes}
-                  />
-                )}
-              </Flex>
-            </ContentLayout>
-          </Form>
-        )}
-      </Formik>
-    </Main>
-  );
-};
-
-export default EditPage;

package/admin/src/pages/Roles/CreatePage/utils/schema.js

@@ -1,9 +0,0 @@
-import * as yup from 'yup';
-import { translatedErrors } from '@strapi/helper-plugin';
-
-const schema = yup.object().shape({
-  name: yup.string().required(translatedErrors.required),
-  description: yup.string().required(translatedErrors.required),
-});
-
-export default schema;