@strapi/plugin-users-permissions 4.0.0-next.6 → 4.0.0

package/strapi-admin.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./admin/src').default;

package/strapi-server.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./server');

package/admin/src/assets/images/logo.svg

@@ -1 +0,0 @@
-<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><text transform="translate(-24 -6)" fill="#4B515A" fill-rule="evenodd" font-size="24" font-family="AppleColorEmoji, Apple Color Emoji"><tspan x="24" y="28">🔐</tspan></text></svg>

package/admin/src/components/BaselineAlignement/index.js

@@ -1,33 +0,0 @@
-import PropTypes from 'prop-types';
-import styled from 'styled-components';
-
-// You can see in the index.js file that I used the design system to do the UI integration but
-// sometimes, we need to create some "temporary" custom style to fix the baseline alignment.
-// -----
-// TODO : remove this component. I think that this kind components should not exist in Strapi.
-// I create it to temporary fix the baseline alignment until we have the design system.
-
-const BaselineAlignment = styled.div`
-  padding-top: ${({ size, top }) => top && size};
-  padding-right: ${({ size, right }) => right && size};
-  padding-bottom: ${({ size, bottom }) => bottom && size};
-  padding-left: ${({ size, left }) => left && size};
-`;
-
-BaselineAlignment.defaultProps = {
-  bottom: false,
-  left: false,
-  right: false,
-  size: '0',
-  top: false,
-};
-
-BaselineAlignment.propTypes = {
-  bottom: PropTypes.bool,
-  left: PropTypes.bool,
-  right: PropTypes.bool,
-  size: PropTypes.string,
-  top: PropTypes.bool,
-};
-
-export default BaselineAlignment;

package/admin/src/components/Bloc/index.js

@@ -1,10 +0,0 @@
-import styled from 'styled-components';
-
-const Bloc = styled.div`
-  flex: 1;
-  background: ${({ theme }) => theme.main.colors.white};
-  border-radius: ${({ theme }) => theme.main.sizes.borderRadius};
-  box-shadow: 0 2px 4px #e3e9f3;
-`;
-
-export default Bloc;

package/admin/src/components/BoundRoute/Components.js

@@ -1,78 +0,0 @@
-import styled from 'styled-components';
-import { themePropTypes } from '@strapi/helper-plugin';
-
-const Wrapper = styled.div`
-  display: flex;
-  min-height: 2.4rem;
-  border-radius: 3px;
-  background-color: #e9eaeb;
-  line-height: 2.4rem;
-`;
-
-const Header = styled.div`
-  margin-bottom: 3rem;
-  padding-top: 1.2rem;
-  color: #333740;
-  font-size: 18px;
-  font-weight: ${({ theme }) => theme.main.fontWeights.bold};
-
-  > span:not(:first-child) {
-    color: #787e8f;
-    font-size: 16px;
-    font-weight: ${({ theme }) => theme.main.fontWeights.semiBold};
-  }
-
-  > span:last-child {
-    color: #1642e1;
-    font-weight: ${({ theme }) => theme.main.fontWeights.bold};
-  }
-`;
-
-Header.propTypes = {
-  ...themePropTypes,
-};
-
-const Path = styled.div`
-  padding: 0 1rem;
-  font-size: 13px;
-  font-weight: ${({ theme }) => theme.main.fontWeights.bold};
-  color: #333740;
-`;
-
-Path.propTypes = {
-  ...themePropTypes,
-};
-
-const Verb = styled.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  padding: 0 1rem;
-  border-radius: 3px;
-  color: #ffffff;
-  font-size: 12px;
-  font-weight: ${({ theme }) => theme.main.fontWeights.bold};
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-  &.get {
-    background-color: #008dfe;
-  }
-
-  &.post {
-    background-color: #69ba05;
-  }
-
-  &.put {
-    background-color: #f68e0e;
-  }
-
-  &.delete {
-    background-color: #f64d0a;
-  }
-`;
-
-Verb.propTypes = {
-  ...themePropTypes,
-};
-
-export { Header, Path, Verb, Wrapper };

package/admin/src/components/ContainerFluid/index.js

@@ -1,13 +0,0 @@
-import styled from 'styled-components';
-import { Container } from 'reactstrap';
-
-const ContainerFluid = styled(Container)`
-  padding: ${({ padding }) => padding};
-`;
-
-ContainerFluid.defaultProps = {
-  fluid: true,
-  padding: '18px 30px !important',
-};
-
-export default ContainerFluid;

package/admin/src/components/FormBloc/index.js

@@ -1,61 +0,0 @@
-import React from 'react';
-import { Flex, Padded, Text } from '@buffetjs/core';
-import { LoadingIndicator } from '@strapi/helper-plugin';
-import PropTypes from 'prop-types';
-import BaselineAlignement from '../BaselineAlignement';
-import Bloc from '../Bloc';
-
-const FormBloc = ({ children, actions, isLoading, title, subtitle }) => (
-  <Bloc>
-    <BaselineAlignement top size={title ? '18px' : '22px'} />
-    <Padded left right size="sm">
-      {isLoading ? (
-        <>
-          <LoadingIndicator />
-          <BaselineAlignement bottom size="22px" />
-        </>
-      ) : (
-        <>
-          {title && (
-            <>
-              <Padded left right size="xs">
-                <Flex justifyContent="space-between">
-                  <Padded left right size="sm">
-                    <Text fontSize="lg" fontWeight="bold">
-                      {title}
-                    </Text>
-                    {subtitle && (
-                      <Text color="grey" lineHeight="1.8rem">
-                        {subtitle}
-                      </Text>
-                    )}
-                  </Padded>
-                  {actions}
-                </Flex>
-              </Padded>
-              <BaselineAlignement top size="18px" />
-            </>
-          )}
-          {children}
-        </>
-      )}
-    </Padded>
-  </Bloc>
-);
-
-FormBloc.defaultProps = {
-  actions: null,
-  isLoading: false,
-  subtitle: null,
-  title: null,
-};
-
-FormBloc.propTypes = {
-  actions: PropTypes.any,
-  children: PropTypes.node.isRequired,
-  isLoading: PropTypes.bool,
-  subtitle: PropTypes.string,
-  title: PropTypes.string,
-};
-
-export default FormBloc;

package/admin/src/components/IntlInput/index.js

@@ -1,38 +0,0 @@
-import React, { useMemo } from 'react';
-import { translatedErrors } from '@strapi/helper-plugin';
-import { useIntl } from 'react-intl';
-import { Inputs } from '@buffetjs/custom';
-import PropTypes from 'prop-types';
-
-const IntlInput = ({ label: labelId, defaultMessage, error, ...rest }) => {
-  const { formatMessage } = useIntl();
-  const label = formatMessage({ id: labelId, defaultMessage: defaultMessage || labelId });
-  const translatedError = error ? formatMessage(error) : null;
-  const formattedErrors = useMemo(() => {
-    return Object.keys(translatedErrors).reduce((acc, current) => {
-      acc[current] = formatMessage({ id: translatedErrors[current] });
-
-      return acc;
-    }, {});
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  return (
-    <Inputs {...rest} label={label} error={translatedError} translatedErrors={formattedErrors} />
-  );
-};
-
-IntlInput.defaultProps = {
-  defaultMessage: null,
-  error: null,
-};
-
-IntlInput.propTypes = {
-  defaultMessage: PropTypes.string,
-  error: PropTypes.shape({
-    id: PropTypes.string,
-  }),
-  label: PropTypes.string.isRequired,
-};
-
-export default IntlInput;

package/admin/src/components/ListBaselineAlignment/index.js

@@ -1,8 +0,0 @@
-import styled from 'styled-components';
-
-// TODO : Temporary baseline alignment
-const ListBaselineAlignment = styled.div`
-  padding-top: 3px;
-`;
-
-export default ListBaselineAlignment;

package/admin/src/components/ListRow/Components.js

@@ -1,74 +0,0 @@
-import styled from 'styled-components';
-
-const Container = styled.div`
-  margin: 0 3.2rem 0 1.9rem;
-  padding: 0 1.4rem 0 0rem;
-  border-bottom: 1px solid rgba(14, 22, 34, 0.04);
-  color: #333740;
-  font-size: 1.3rem;
-  > div {
-    padding: 0;
-    align-self: center;
-  }
-  > div:first-child {
-    padding-left: 1.4rem;
-  }
-  > div:last-child {
-    text-align: right;
-  }
-`;
-
-const Flex = styled.div`
-  display: flex;
-  padding-left: 7px;
-  font-weight: 600;
-  > div:first-child {
-    width: 17px;
-    padding-top: 2px;
-    > i,
-    > svg {
-      font-size: 12px;
-      vertical-align: inherit;
-    }
-  }
-  > div:last-child {
-    width: 80%;
-    margin-left: 54px;
-    padding-left: 7px;
-    text-align: left;
-    font-weight: 500 !important;
-  }
-`;
-
-const Row = styled.div`
-  margin-top: 0 !important;
-  position: relative;
-  height: 5.4rem;
-  line-height: 5.4rem;
-  cursor: pointer;
-  &:hover {
-    background-color: #f7f8f8;
-  }
-  div {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-`;
-
-const Wrapper = styled.div`
-  > div:first-child {
-    text-align: left;
-  }
-  > div:nth-of-type(2) {
-    text-align: center;
-  }
-  strong {
-    font-weight: 600;
-  }
-  b {
-    font-weight: 500;
-  }
-`;
-
-export { Container, Flex, Row, Wrapper };

package/admin/src/components/ListRow/index.js

@@ -1,35 +0,0 @@
-import React from 'react';
-import { CustomRow } from '@buffetjs/styles';
-import { IconLinks } from '@buffetjs/core';
-import PropTypes from 'prop-types';
-import PrefixedIcon from '../PrefixedIcon';
-
-const ListRow = ({ icon, name, onClick, links, children }) => {
-  return (
-    <CustomRow onClick={onClick}>
-      <td>
-        <PrefixedIcon icon={icon} name={name} />
-      </td>
-      {children}
-      <td>
-        <IconLinks links={links} />
-      </td>
-    </CustomRow>
-  );
-};
-
-ListRow.defaultProps = {
-  children: null,
-  onClick: () => {},
-  links: [],
-};
-
-ListRow.propTypes = {
-  children: PropTypes.node,
-  icon: PropTypes.array.isRequired,
-  links: PropTypes.array,
-  name: PropTypes.string.isRequired,
-  onClick: PropTypes.func,
-};
-
-export default ListRow;

package/admin/src/components/ModalForm/Wrapper.js

@@ -1,12 +0,0 @@
-import styled from 'styled-components';
-import { Container } from 'reactstrap';
-
-const Wrapper = styled(Container)`
-  padding: 0;
-`;
-
-Wrapper.defaultProps = {
-  fluid: true,
-};
-
-export default Wrapper;

package/admin/src/components/ModalForm/index.js

@@ -1,59 +0,0 @@
-import React from 'react';
-import { Modal, ModalHeader, ModalSection, ModalFooter } from '@strapi/helper-plugin';
-import { useIntl } from 'react-intl';
-import { Button, Padded } from '@buffetjs/core';
-import PropTypes from 'prop-types';
-import BaselineAlignment from '../ListBaselineAlignment';
-import Wrapper from './Wrapper';
-
-const ModalForm = ({
-  children,
-  headerBreadcrumbs,
-  isLoading,
-  isOpen,
-  onCancel,
-  onClosed,
-  onClick,
-  onOpened,
-  onToggle,
-}) => {
-  const { formatMessage } = useIntl();
-
-  return (
-    <Modal isOpen={isOpen} onOpened={onOpened} onToggle={onToggle} onClosed={onClosed}>
-      <ModalHeader headerBreadcrumbs={headerBreadcrumbs} />
-      <ModalSection>
-        <Wrapper>
-          <BaselineAlignment />
-          <Padded top size="md">
-            {children}
-          </Padded>
-        </Wrapper>
-      </ModalSection>
-      <ModalFooter>
-        <section>
-          <Button type="button" color="cancel" onClick={onCancel}>
-            {formatMessage({ id: 'app.components.Button.cancel' })}
-          </Button>
-          <Button color="success" type="button" onClick={onClick} isLoading={isLoading}>
-            {formatMessage({ id: 'app.components.Button.save' })}
-          </Button>
-        </section>
-      </ModalFooter>
-    </Modal>
-  );
-};
-
-ModalForm.propTypes = {
-  children: PropTypes.node.isRequired,
-  headerBreadcrumbs: PropTypes.array.isRequired,
-  isLoading: PropTypes.bool.isRequired,
-  isOpen: PropTypes.bool.isRequired,
-  onCancel: PropTypes.func.isRequired,
-  onClosed: PropTypes.func.isRequired,
-  onClick: PropTypes.func.isRequired,
-  onOpened: PropTypes.func.isRequired,
-  onToggle: PropTypes.func.isRequired,
-};
-
-export default ModalForm;

package/admin/src/components/Permissions/ListWrapper.js

@@ -1,9 +0,0 @@
-import styled from 'styled-components';
-
-const ListWrapper = styled.div`
-  background-color: ${({ theme }) => theme.main.colors.white};
-  padding-top: 1rem;
-  padding-bottom: 1.8rem;
-`;
-
-export default ListWrapper;

package/admin/src/components/Permissions/PermissionRow/BaselineAlignment.js

@@ -1,7 +0,0 @@
-import styled from 'styled-components';
-
-const BaselineAlignment = styled.div`
-  padding-top: 1px;
-`;
-
-export default BaselineAlignment;

package/admin/src/components/Permissions/PermissionRow/RowStyle.js

@@ -1,28 +0,0 @@
-import styled from 'styled-components';
-import { Text } from '@buffetjs/core';
-
-const activeStyle = theme => `
-    background-color: ${({ theme }) => theme.main.colors.lightestBlue};
-    border: 1px solid ${theme.main.colors.darkBlue};
-    ${Text} {
-      color: ${theme.main.colors.mediumBlue};
-    }
-    svg {
-      color: ${theme.main.colors.mediumBlue};
-    }
-`;
-
-const RowStyle = styled.div`
-  height: 5.4rem;
-  padding: 1rem 3rem;
-  border: 1px solid transparent;
-  background-color: ${({ theme, isWhite }) => theme.main.colors[isWhite ? 'white' : 'lightGrey']};
-  cursor: pointer;
-  &:hover {
-    background-color: ${({ theme }) => theme.main.colors.lightestBlue};
-    ${({ theme }) => activeStyle(theme)};
-  }
-  ${({ isActive, theme }) => isActive && activeStyle(theme)};
-`;
-
-export default RowStyle;

package/admin/src/components/Permissions/PermissionRow/SubCategory/ConditionsButtonWrapper.js

@@ -1,13 +0,0 @@
-/* eslint-disable indent */
-import styled from 'styled-components';
-
-const ConditionsButtonWrapper = styled.div`
-  padding: 0.9rem;
-  ${({ hasConditions }) =>
-    hasConditions &&
-    `
-    padding-left: 22px;
-  `}
-`;
-
-export default ConditionsButtonWrapper;

package/admin/src/components/Permissions/PermissionRow/SubCategory/PolicyWrapper.js

@@ -1,8 +0,0 @@
-import styled from 'styled-components';
-
-const PolicyWrapper = styled.div`
-  flex: 1;
-  text-align: end;
-`;
-
-export default PolicyWrapper;

package/admin/src/components/Permissions/PermissionRow/SubCategory/SubCategoryWrapper.js

@@ -1,26 +0,0 @@
-/* eslint-disable indent */
-import styled from 'styled-components';
-
-const SubCategoryWrapper = styled.div`
-  padding-bottom: 2.6rem;
-  input[type='checkbox'] {
-    &:after {
-      color: ${({ theme }) => theme.main.colors.mediumBlue};
-    }
-  }
-  ${({ disabled, theme }) =>
-    disabled &&
-    `
-    label {
-      cursor: default !important;
-      color: ${theme.main.colors.grey};
-    }
-    input[type='checkbox'] {
-        &:after {
-          color: ${theme.main.colors.grey};
-        }
-      }
-    `}
-`;
-
-export default SubCategoryWrapper;

package/admin/src/components/Permissions/PermissionRow/SubCategory/index.js

@@ -1,116 +0,0 @@
-import React, { useCallback, useMemo } from 'react';
-import { get } from 'lodash';
-import styled from 'styled-components';
-import PropTypes from 'prop-types';
-import { Flex, Padded, Text, Checkbox } from '@buffetjs/core';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { useIntl } from 'react-intl';
-import CheckboxWrapper from '../CheckboxWrapper';
-import BaselineAlignment from '../BaselineAlignment';
-import SubCategoryWrapper from './SubCategoryWrapper';
-import { useUsersPermissions } from '../../../../contexts/UsersPermissionsContext';
-import PolicyWrapper from './PolicyWrapper';
-
-const Border = styled.div`
-  flex: 1;
-  align-self: center;
-  border-top: 1px solid #f6f6f6;
-  padding: 0px 10px;
-`;
-
-const SubCategory = ({ subCategory }) => {
-  const { formatMessage } = useIntl();
-  const {
-    onChange,
-    onChangeSelectAll,
-    onSelectedAction,
-    selectedAction,
-    modifiedData,
-  } = useUsersPermissions();
-
-  const currentScopedModifiedData = useMemo(() => {
-    return get(modifiedData, subCategory.name, {});
-  }, [modifiedData, subCategory]);
-
-  const hasAllActionsSelected = useMemo(() => {
-    return Object.values(currentScopedModifiedData).every(action => action.enabled === true);
-  }, [currentScopedModifiedData]);
-
-  const hasSomeActionsSelected = useMemo(() => {
-    return (
-      Object.values(currentScopedModifiedData).some(action => action.enabled === true) &&
-      !hasAllActionsSelected
-    );
-  }, [currentScopedModifiedData, hasAllActionsSelected]);
-
-  const handleChangeSelectAll = useCallback(
-    ({ target: { name } }) => {
-      onChangeSelectAll({ target: { name, value: !hasAllActionsSelected } });
-    },
-    [hasAllActionsSelected, onChangeSelectAll]
-  );
-
-  const isActionSelected = useCallback(
-    actionName => {
-      return selectedAction === actionName;
-    },
-    [selectedAction]
-  );
-
-  return (
-    <SubCategoryWrapper>
-      <Flex justifyContent="space-between" alignItems="center">
-        <Padded right size="sm">
-          <Text
-            lineHeight="18px"
-            color="#919bae"
-            fontWeight="bold"
-            fontSize="xs"
-            textTransform="uppercase"
-          >
-            {subCategory.label}
-          </Text>
-        </Padded>
-        <Border />
-        <Padded left size="sm">
-          <BaselineAlignment />
-          <Checkbox
-            name={subCategory.name}
-            message={formatMessage({ id: 'app.utils.select-all' })}
-            onChange={handleChangeSelectAll}
-            someChecked={hasSomeActionsSelected}
-            value={hasAllActionsSelected}
-          />
-        </Padded>
-      </Flex>
-      <BaselineAlignment />
-      <Padded top size="xs">
-        <Flex flexWrap="wrap">
-          {subCategory.actions.map(action => {
-            const name = `${action.name}.enabled`;
-
-            return (
-              <CheckboxWrapper isActive={isActionSelected(action.name)} key={action.name}>
-                <Checkbox
-                  value={get(modifiedData, name, false)}
-                  name={name}
-                  message={action.label}
-                  onChange={onChange}
-                />
-                <PolicyWrapper onClick={() => onSelectedAction(action.name)}>
-                  <FontAwesomeIcon icon="cog" />
-                </PolicyWrapper>
-              </CheckboxWrapper>
-            );
-          })}
-        </Flex>
-      </Padded>
-    </SubCategoryWrapper>
-  );
-};
-
-SubCategory.propTypes = {
-  subCategory: PropTypes.object.isRequired,
-};
-
-export default SubCategory;

package/admin/src/components/Policies/Components.js

@@ -1,26 +0,0 @@
-import styled from 'styled-components';
-import { themePropTypes } from '@strapi/helper-plugin';
-
-const Wrapper = styled.div`
-  min-height: 100%;
-  background-color: #f6f6f6;
-`;
-
-const Header = styled.div`
-  margin-bottom: 1.1rem;
-  padding-top: 1.1rem;
-  font-size: 18px;
-  font-weight: ${({ theme }) => theme.main.fontWeights.bold};
-  line-height: 3.6rem;
-`;
-
-const Sticky = styled.div`
-  position: sticky;
-  top: 70px;
-`;
-
-Header.propTypes = {
-  ...themePropTypes,
-};
-
-export { Header, Wrapper, Sticky };