mirror of
https://github.com/strapi/strapi.git
synced 2025-12-27 15:13:21 +00:00
replaced components with v2 components
This commit is contained in:
ronronscelestes
parent
d03cb8b2bf
commit
0ff9c27701
@ -6,7 +6,7 @@ import styled, { keyframes } from 'styled-components';
|
||||
import { pxToRem } from '@strapi/helper-plugin';
|
||||
import Clock from '@strapi/icons/Clock';
|
||||
import Refresh from '@strapi/icons/Refresh';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Link } from '@strapi/design-system/v2/Link';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
@ -72,11 +72,7 @@ const Blocker = ({ displayedIcon, description, title, isOpen }) => {
|
||||
</Flex>
|
||||
<Flex justifyContent="center">
|
||||
<Box paddingTop={2}>
|
||||
<Link
|
||||
href="https://docs.strapi.io"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer nofollow"
|
||||
>
|
||||
<Link href="https://docs.strapi.io" isExternal>
|
||||
{formatMessage({
|
||||
id: 'global.documentation',
|
||||
defaultMessage: 'Read the documentation',
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
import React from 'react';
|
||||
import { useGuidedTour, useTracking } from '@strapi/helper-plugin';
|
||||
import { useGuidedTour, useTracking, LinkButton } from '@strapi/helper-plugin';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import ArrowRight from '@strapi/icons/ArrowRight';
|
||||
import StepperHomepage from './components/Stepper';
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { pxToRem } from '@strapi/helper-plugin';
|
||||
import { pxToRem, LinkButton } from '@strapi/helper-plugin';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import ArrowRight from '@strapi/icons/ArrowRight';
|
||||
|
||||
@ -2,7 +2,7 @@ import React, { useRef, useState } from 'react';
|
||||
import styled from 'styled-components';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { NavLink as Link } from 'react-router-dom';
|
||||
import { NavLink as RouterNavLink } from 'react-router-dom';
|
||||
import { Divider } from '@strapi/design-system/Divider';
|
||||
import {
|
||||
MainNav,
|
||||
@ -12,7 +12,7 @@ import {
|
||||
NavSection,
|
||||
NavUser,
|
||||
NavCondense,
|
||||
} from '@strapi/design-system/MainNav';
|
||||
} from '@strapi/design-system/v2/MainNav';
|
||||
import { FocusTrap } from '@strapi/design-system/FocusTrap';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
@ -29,7 +29,7 @@ const LinkUserWrapper = styled(Box)`
|
||||
left: ${({ theme }) => theme.spaces[5]};
|
||||
`;
|
||||
|
||||
const LinkUser = styled(Link)`
|
||||
const LinkUser = styled(RouterNavLink)`
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@ -88,6 +88,7 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => {
|
||||
return (
|
||||
<MainNav condensed={condensed}>
|
||||
<NavBrand
|
||||
as={RouterNavLink}
|
||||
workplace={formatMessage({
|
||||
id: 'app.components.LeftMenu.navbrand.workplace',
|
||||
defaultMessage: 'Workplace',
|
||||
@ -99,7 +100,7 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => {
|
||||
<Divider />
|
||||
|
||||
<NavSections>
|
||||
<NavLink to="/content-manager" icon={<Write />}>
|
||||
<NavLink as={RouterNavLink} to="/content-manager" icon={<Write />}>
|
||||
{formatMessage({ id: 'global.content-manager', defaultMessage: 'Content manager' })}
|
||||
</NavLink>
|
||||
|
||||
@ -109,7 +110,7 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => {
|
||||
const Icon = link.icon;
|
||||
|
||||
return (
|
||||
<NavLink to={link.to} key={link.to} icon={<Icon />}>
|
||||
<NavLink as={RouterNavLink} to={link.to} key={link.to} icon={<Icon />}>
|
||||
{formatMessage(link.intlLabel)}
|
||||
</NavLink>
|
||||
);
|
||||
@ -124,6 +125,7 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => {
|
||||
|
||||
return (
|
||||
<NavLink
|
||||
as={RouterNavLink}
|
||||
badgeContent={
|
||||
(link.notificationsCount > 0 && link.notificationsCount.toString()) || undefined
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@ import React, { useEffect, useCallback } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { Alert } from '@strapi/design-system/Alert';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Link } from '@strapi/design-system/v2/Link';
|
||||
|
||||
const Notification = ({ dispatch, notification }) => {
|
||||
const { formatMessage } = useIntl();
|
||||
@ -60,7 +60,7 @@ const Notification = ({ dispatch, notification }) => {
|
||||
<Alert
|
||||
action={
|
||||
link ? (
|
||||
<Link href={link.url} target="_blank">
|
||||
<Link href={link.url} isExternal>
|
||||
{formatMessage({
|
||||
id: link.label?.id || link.label,
|
||||
defaultMessage: link.label?.defaultMessage || link.label?.id || link.label,
|
||||
|
||||
@ -5,7 +5,7 @@ import { useIntl } from 'react-intl';
|
||||
import { Portal } from '@strapi/design-system/Portal';
|
||||
import { FocusTrap } from '@strapi/design-system/FocusTrap';
|
||||
import { IconButton } from '@strapi/design-system/IconButton';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { LinkButton } from '@strapi/design-system/v2/LinkButton';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
@ -104,7 +104,11 @@ const UpgradePlanModal = ({ onClose, isOpen }) => {
|
||||
})}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<LinkButton href="https://strapi.io/pricing-self-hosted" endIcon={<ExternalLink />}>
|
||||
<LinkButton
|
||||
href="https://strapi.io/pricing-self-hosted"
|
||||
isExternal
|
||||
endIcon={<ExternalLink />}
|
||||
>
|
||||
{formatMessage({
|
||||
id: 'app.components.UpgradePlanModal.button',
|
||||
defaultMessage: 'Learn more',
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import React, { memo } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import styled from 'styled-components';
|
||||
import { pxToRem, RemoveRoundedButton } from '@strapi/helper-plugin';
|
||||
import { pxToRem, RemoveRoundedButton, Link } from '@strapi/helper-plugin';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import has from 'lodash/has';
|
||||
@ -9,7 +9,6 @@ import isEmpty from 'lodash/isEmpty';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { getTrad } from '../../utils';
|
||||
|
||||
const StyledBullet = styled.div`
|
||||
|
||||
@ -1,21 +1,22 @@
|
||||
import React, { useCallback, useState, useEffect, useMemo, memo } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import {
|
||||
// FormattedMessage,
|
||||
useIntl,
|
||||
} from 'react-intl';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { useTheme } from 'styled-components';
|
||||
import findIndex from 'lodash/findIndex';
|
||||
import get from 'lodash/get';
|
||||
import isArray from 'lodash/isArray';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import set from 'lodash/set';
|
||||
import { NotAllowedInput, useCMEditViewDataManager, useQueryParams } from '@strapi/helper-plugin';
|
||||
import {
|
||||
NotAllowedInput,
|
||||
useCMEditViewDataManager,
|
||||
useQueryParams,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { stringify } from 'qs';
|
||||
import axios from 'axios';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { axiosInstance } from '../../../core/utils';
|
||||
import { getTrad } from '../../utils';
|
||||
import Label from './Label';
|
||||
|
||||
@ -5,18 +5,19 @@
|
||||
*/
|
||||
|
||||
import React, { useMemo, useState } from 'react';
|
||||
import { useSelector, shallowEqual } from 'react-redux';
|
||||
import { useIntl } from 'react-intl';
|
||||
import matchSorter from 'match-sorter';
|
||||
import sortBy from 'lodash/sortBy';
|
||||
import toLower from 'lodash/toLower';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import {
|
||||
SubNav,
|
||||
SubNavHeader,
|
||||
SubNavSection,
|
||||
SubNavSections,
|
||||
SubNavLink,
|
||||
} from '@strapi/design-system/SubNav';
|
||||
import { useSelector, shallowEqual } from 'react-redux';
|
||||
import { useIntl } from 'react-intl';
|
||||
import matchSorter from 'match-sorter';
|
||||
import sortBy from 'lodash/sortBy';
|
||||
import toLower from 'lodash/toLower';
|
||||
} from '@strapi/design-system/v2/SubNav';
|
||||
import getTrad from '../../../utils/getTrad';
|
||||
import { makeSelectModelLinks } from '../selectors';
|
||||
|
||||
@ -111,7 +112,7 @@ const LeftMenu = () => {
|
||||
const search = link.search ? `?${link.search}` : '';
|
||||
|
||||
return (
|
||||
<SubNavLink key={link.uid} to={`${link.to}${search}`}>
|
||||
<SubNavLink as={NavLink} key={link.uid} to={`${link.to}${search}`}>
|
||||
{link.title}
|
||||
</SubNavLink>
|
||||
);
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import Cog from '@strapi/icons/Cog';
|
||||
import { useIntl } from 'react-intl';
|
||||
|
||||
@ -5,10 +5,9 @@
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { useTracking, CheckPermissions } from '@strapi/helper-plugin';
|
||||
import { useTracking, CheckPermissions, LinkButton } from '@strapi/helper-plugin';
|
||||
import { useIntl } from 'react-intl';
|
||||
import get from 'lodash/get';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import Pencil from '@strapi/icons/Pencil';
|
||||
import getTrad from '../../../utils/getTrad';
|
||||
import useLayoutDnd from '../../../hooks/useLayoutDnd';
|
||||
|
||||
@ -9,11 +9,10 @@ import flatMap from 'lodash/flatMap';
|
||||
import isEqual from 'lodash/isEqual';
|
||||
import get from 'lodash/get';
|
||||
import set from 'lodash/set';
|
||||
import { useNotification, useTracking, ConfirmDialog } from '@strapi/helper-plugin';
|
||||
import { useNotification, useTracking, ConfirmDialog, Link } from '@strapi/helper-plugin';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
import React, { memo, useRef, useState } from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
import isEqualFastCompare from 'react-fast-compare';
|
||||
import get from 'lodash/get';
|
||||
import isEqual from 'lodash/isEqual';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import { Link } from '@strapi/helper-plugin';
|
||||
import { HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Dialog, DialogBody, DialogFooter } from '@strapi/design-system/Dialog';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import ExclamationMarkCircle from '@strapi/icons/ExclamationMarkCircle';
|
||||
import Check from '@strapi/icons/Check';
|
||||
import PropTypes from 'prop-types';
|
||||
import isEqualFastCompare from 'react-fast-compare';
|
||||
import { getTrad } from '../../../utils';
|
||||
import { connect, getDraftRelations, select } from './utils';
|
||||
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import React, { memo, useCallback, useMemo } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import get from 'lodash/get';
|
||||
import { CheckPermissions, useTracking } from '@strapi/helper-plugin';
|
||||
import { CheckPermissions, useTracking, LinkButton } from '@strapi/helper-plugin';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Divider } from '@strapi/design-system/Divider';
|
||||
import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
@ -15,9 +14,7 @@ import Layer from '@strapi/icons/Layer';
|
||||
import Pencil from '@strapi/icons/Pencil';
|
||||
import { InjectionZone } from '../../../shared/components';
|
||||
import permissions from '../../../permissions';
|
||||
// import Container from '../../components/Container';
|
||||
import DynamicZone from '../../components/DynamicZone';
|
||||
// import FormWrapper from '../../components/FormWrapper';
|
||||
import FieldComponent from '../../components/FieldComponent';
|
||||
import Inputs from '../../components/Inputs';
|
||||
import SelectWrapper from '../../components/SelectWrapper';
|
||||
|
||||
@ -6,12 +6,11 @@ import upperFirst from 'lodash/upperFirst';
|
||||
import pick from 'lodash/pick';
|
||||
import get from 'lodash/get';
|
||||
import { stringify } from 'qs';
|
||||
import { useNotification, useTracking, ConfirmDialog } from '@strapi/helper-plugin';
|
||||
import { useNotification, useTracking, ConfirmDialog, Link } from '@strapi/helper-plugin';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Divider } from '@strapi/design-system/Divider';
|
||||
import { Layout, HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import Check from '@strapi/icons/Check';
|
||||
|
||||
@ -17,6 +17,7 @@ import {
|
||||
useNotification,
|
||||
useRBACProvider,
|
||||
useTracking,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { IconButton } from '@strapi/design-system/IconButton';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
@ -24,7 +25,6 @@ import { Box } from '@strapi/design-system/Box';
|
||||
import { ActionLayout, ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { useNotifyAT } from '@strapi/design-system/LiveRegions';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
import Cog from '@strapi/icons/Cog';
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
import React from 'react';
|
||||
import { useFocusWhenNavigate } from '@strapi/helper-plugin';
|
||||
import { useFocusWhenNavigate, LinkButton } from '@strapi/helper-plugin';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
|
||||
@ -1,12 +1,11 @@
|
||||
import React from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Form } from '@strapi/helper-plugin';
|
||||
import { Form, Link } from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { TextInput } from '@strapi/design-system/TextInput';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import React from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { Link } from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import UnauthenticatedLayout, {
|
||||
Column,
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Form, Link } from '@strapi/helper-plugin';
|
||||
import EyeStriked from '@strapi/icons/EyeStriked';
|
||||
import Eye from '@strapi/icons/Eye';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { TextInput } from '@strapi/design-system/TextInput';
|
||||
import { Checkbox } from '@strapi/design-system/Checkbox';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Form } from '@strapi/helper-plugin';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import styled from 'styled-components';
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
import React from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useQuery } from '@strapi/helper-plugin';
|
||||
import { useQuery, Link } from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import UnauthenticatedLayout, {
|
||||
Column,
|
||||
|
||||
@ -3,11 +3,22 @@ import { useIntl } from 'react-intl';
|
||||
import styled from 'styled-components';
|
||||
import get from 'lodash/get';
|
||||
import omit from 'lodash/omit';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Formik } from 'formik';
|
||||
import axios from 'axios';
|
||||
import {
|
||||
Form,
|
||||
useQuery,
|
||||
useNotification,
|
||||
useTracking,
|
||||
getYupInnerErrors,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { TextInput } from '@strapi/design-system/TextInput';
|
||||
import { Checkbox } from '@strapi/design-system/Checkbox';
|
||||
@ -15,17 +26,6 @@ import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import EyeStriked from '@strapi/icons/EyeStriked';
|
||||
import Eye from '@strapi/icons/Eye';
|
||||
import {
|
||||
Form,
|
||||
useQuery,
|
||||
useNotification,
|
||||
useTracking,
|
||||
getYupInnerErrors,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Formik } from 'formik';
|
||||
import axios from 'axios';
|
||||
import UnauthenticatedLayout, {
|
||||
Column,
|
||||
LayoutContent,
|
||||
|
||||
@ -1,19 +1,18 @@
|
||||
import React, { useState } from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Form } from '@strapi/helper-plugin';
|
||||
import styled from 'styled-components';
|
||||
import { Formik } from 'formik';
|
||||
import { Form, Link } from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { TextInput } from '@strapi/design-system/TextInput';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import EyeStriked from '@strapi/icons/EyeStriked';
|
||||
import Eye from '@strapi/icons/Eye';
|
||||
import styled from 'styled-components';
|
||||
import { Formik } from 'formik';
|
||||
import UnauthenticatedLayout, {
|
||||
Column,
|
||||
LayoutContent,
|
||||
|
||||
@ -3,7 +3,7 @@ import styled from 'styled-components';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Link } from '@strapi/design-system/v2/Link';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
@ -49,7 +49,7 @@ const HomeHeader = ({ hasCreatedContentType, onCreateCT }) => {
|
||||
})}
|
||||
</WordWrap>
|
||||
{hasCreatedContentType ? (
|
||||
<Link href="https://strapi.io/blog">
|
||||
<Link isExternal href="https://strapi.io/blog">
|
||||
{formatMessage({
|
||||
id: 'app.components.HomePage.button.blog',
|
||||
defaultMessage: 'See more on the blog',
|
||||
|
||||
@ -10,8 +10,8 @@ import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { LinkButton } from '@strapi/design-system/v2/LinkButton';
|
||||
import { Link } from '@strapi/design-system/v2/Link';
|
||||
import ExternalLink from '@strapi/icons/ExternalLink';
|
||||
import Github from '@strapi/icons/Github';
|
||||
import Discord from '@strapi/icons/Discord';
|
||||
@ -167,7 +167,7 @@ const SocialLinks = () => {
|
||||
})}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Link href="https://feedback.strapi.io/" endIcon={<ExternalLink />}>
|
||||
<Link href="https://feedback.strapi.io/" isExternal endIcon={<ExternalLink />}>
|
||||
{formatMessage({
|
||||
id: 'app.components.HomePage.roadmap',
|
||||
defaultMessage: 'See our road map',
|
||||
@ -184,6 +184,7 @@ const SocialLinks = () => {
|
||||
startIcon={socialLink.icon}
|
||||
variant="tertiary"
|
||||
href={socialLink.link}
|
||||
isExternal
|
||||
>
|
||||
{socialLink.name}
|
||||
</LinkCustom>
|
||||
|
||||
@ -5,9 +5,8 @@
|
||||
*
|
||||
*/
|
||||
import React from 'react';
|
||||
import { useFocusWhenNavigate } from '@strapi/helper-plugin';
|
||||
import { useFocusWhenNavigate, LinkButton } from '@strapi/helper-plugin';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
|
||||
import EmptyPictures from '@strapi/icons/EmptyPictures';
|
||||
|
||||
@ -2,7 +2,7 @@ import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { LinkButton } from '@strapi/design-system/v2/LinkButton';
|
||||
import Upload from '@strapi/icons/Upload';
|
||||
import { useTracking } from '@strapi/helper-plugin';
|
||||
|
||||
@ -27,6 +27,7 @@ const PageHeader = ({ isOnline }) => {
|
||||
variant="tertiary"
|
||||
href="https://market.strapi.io/submit-plugin"
|
||||
onClick={() => trackUsage('didSubmitPlugin')}
|
||||
isExternal
|
||||
>
|
||||
{formatMessage({
|
||||
id: 'admin.pages.MarketPlacePage.submit.plugin.link',
|
||||
|
||||
@ -5,7 +5,7 @@ import styled from 'styled-components';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { LinkButton } from '@strapi/design-system/v2/LinkButton';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Icon } from '@strapi/design-system/Icon';
|
||||
import { Tooltip } from '@strapi/design-system/Tooltip';
|
||||
@ -108,6 +108,7 @@ const PluginCard = ({ plugin, installedPluginNames, useYarn, isInDevelopmentMode
|
||||
<LinkButton
|
||||
size="S"
|
||||
href={`https://market.strapi.io/plugins/${attributes.slug}`}
|
||||
isExternal
|
||||
endIcon={<ExternalLink />}
|
||||
aria-label={formatMessage(
|
||||
{
|
||||
|
||||
@ -5,9 +5,8 @@
|
||||
*
|
||||
*/
|
||||
import React from 'react';
|
||||
import { useFocusWhenNavigate } from '@strapi/helper-plugin';
|
||||
import { useFocusWhenNavigate, LinkButton } from '@strapi/helper-plugin';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
|
||||
import EmptyPictures from '@strapi/icons/EmptyPictures';
|
||||
|
||||
@ -1,13 +1,14 @@
|
||||
import React from 'react';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import { useIntl } from 'react-intl';
|
||||
import PropTypes from 'prop-types';
|
||||
import {
|
||||
SubNav,
|
||||
SubNavHeader,
|
||||
SubNavSection,
|
||||
SubNavSections,
|
||||
SubNavLink,
|
||||
} from '@strapi/design-system/SubNav';
|
||||
import { useIntl } from 'react-intl';
|
||||
import PropTypes from 'prop-types';
|
||||
} from '@strapi/design-system/v2/SubNav';
|
||||
import { getSectionsToDisplay } from '../../utils';
|
||||
|
||||
const SettingsNav = ({ menu }) => {
|
||||
@ -41,7 +42,7 @@ const SettingsNav = ({ menu }) => {
|
||||
{sections.map(section => (
|
||||
<SubNavSection key={section.id} label={formatMessage(section.intlLabel)}>
|
||||
{section.links.map(link => (
|
||||
<SubNavLink withBullet={link.hasNotification} to={link.to} key={link.id}>
|
||||
<SubNavLink as={NavLink} withBullet={link.hasNotification} to={link.to} key={link.id}>
|
||||
{formatMessage(link.intlLabel)}
|
||||
</SubNavLink>
|
||||
))}
|
||||
|
||||
@ -8,13 +8,13 @@ import {
|
||||
useNotification,
|
||||
useTracking,
|
||||
useGuidedTour,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import Check from '@strapi/icons/Check';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Formik } from 'formik';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
|
||||
@ -2,7 +2,7 @@ import React from 'react';
|
||||
import Pencil from '@strapi/icons/Pencil';
|
||||
import { useIntl } from 'react-intl';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Link } from '@strapi/helper-plugin';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import styled from 'styled-components';
|
||||
|
||||
|
||||
@ -10,11 +10,11 @@ import {
|
||||
DynamicTable,
|
||||
useTracking,
|
||||
useGuidedTour,
|
||||
LinkButton,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
import { useQuery, useMutation, useQueryClient } from 'react-query';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
|
||||
@ -8,7 +8,7 @@ import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Link } from '@strapi/design-system/v2/Link';
|
||||
import ExternalLink from '@strapi/icons/ExternalLink';
|
||||
|
||||
const ApplicationInfosPage = () => {
|
||||
@ -65,6 +65,7 @@ const ApplicationInfosPage = () => {
|
||||
? 'https://discord.strapi.io'
|
||||
: 'https://support.strapi.io/support/home'
|
||||
}
|
||||
isExternal
|
||||
endIcon={<ExternalLink />}
|
||||
>
|
||||
{formatMessage({
|
||||
@ -96,6 +97,7 @@ const ApplicationInfosPage = () => {
|
||||
{shouldUpdateStrapi && (
|
||||
<Link
|
||||
href={`https://github.com/strapi/strapi/releases/tag/${latestStrapiReleaseTag}`}
|
||||
isExternal
|
||||
endIcon={<ExternalLink />}
|
||||
>
|
||||
{formatMessage({
|
||||
@ -106,7 +108,11 @@ const ApplicationInfosPage = () => {
|
||||
)}
|
||||
</GridItem>
|
||||
<GridItem col={6} s={12}>
|
||||
<Link href="https://strapi.io/pricing-self-hosted" endIcon={<ExternalLink />}>
|
||||
<Link
|
||||
href="https://strapi.io/pricing-self-hosted"
|
||||
isExternal
|
||||
endIcon={<ExternalLink />}
|
||||
>
|
||||
{formatMessage({
|
||||
id: 'Settings.application.link-pricing',
|
||||
defaultMessage: 'See all pricing plans',
|
||||
|
||||
@ -6,6 +6,7 @@ import {
|
||||
useTracking,
|
||||
LoadingIndicatorPage,
|
||||
SettingsPageTitle,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
@ -13,7 +14,6 @@ import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Formik } from 'formik';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import get from 'lodash/get';
|
||||
import { useIntl } from 'react-intl';
|
||||
|
||||
@ -15,6 +15,7 @@ import {
|
||||
useNotification,
|
||||
useOverlayBlocker,
|
||||
LoadingIndicatorPage,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { useQuery } from 'react-query';
|
||||
import { Formik } from 'formik';
|
||||
@ -22,7 +23,6 @@ import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { HeaderLayout, ContentLayout } from '@strapi/design-system/Layout';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import React, { useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Form } from '@strapi/helper-plugin';
|
||||
import { Form, Link } from '@strapi/helper-plugin';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import Check from '@strapi/icons/Check';
|
||||
import Publish from '@strapi/icons/Play';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { TextInput } from '@strapi/design-system/TextInput';
|
||||
import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
|
||||
@ -17,6 +17,7 @@ import {
|
||||
ConfirmDialog,
|
||||
onRowClick,
|
||||
stopPropagation,
|
||||
LinkButton,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { HeaderLayout, Layout, ContentLayout, ActionLayout } from '@strapi/design-system/Layout';
|
||||
import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
|
||||
@ -30,7 +31,6 @@ import { Button } from '@strapi/design-system/Button';
|
||||
import { VisuallyHidden } from '@strapi/design-system/VisuallyHidden';
|
||||
import { Switch } from '@strapi/design-system/Switch';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { LinkButton } from '@strapi/design-system/LinkButton';
|
||||
import { useNotifyAT } from '@strapi/design-system/LiveRegions';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
import React from 'react';
|
||||
import { Redirect, useHistory } from 'react-router-dom';
|
||||
import styled from 'styled-components';
|
||||
import { Link } from '@strapi/helper-plugin';
|
||||
import { Divider } from '@strapi/design-system/Divider';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Loader } from '@strapi/design-system/Loader';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
|
||||
@ -9,13 +9,13 @@ import {
|
||||
useNotification,
|
||||
useOverlayBlocker,
|
||||
useTracking,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { Grid, GridItem } from '@strapi/design-system/Grid';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
|
||||
@ -1,4 +1,7 @@
|
||||
import React from 'react';
|
||||
import upperFirst from 'lodash/upperFirst';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import {
|
||||
@ -8,10 +11,8 @@ import {
|
||||
SubNavLinkSection,
|
||||
SubNavSection,
|
||||
SubNavSections,
|
||||
} from '@strapi/design-system/SubNav';
|
||||
} from '@strapi/design-system/v2/SubNav';
|
||||
import { TextButton } from '@strapi/design-system/TextButton';
|
||||
import upperFirst from 'lodash/upperFirst';
|
||||
import { useIntl } from 'react-intl';
|
||||
import useContentTypeBuilderMenu from './useContentTypeBuilderMenu';
|
||||
import getTrad from '../../utils/getTrad';
|
||||
|
||||
@ -53,7 +54,12 @@ const ContentTypeBuilderNav = () => {
|
||||
return (
|
||||
<SubNavLinkSection key={link.name} label={upperFirst(link.title)}>
|
||||
{link.links.map(subLink => (
|
||||
<SubNavLink to={subLink.to} active={subLink.active} key={subLink.name}>
|
||||
<SubNavLink
|
||||
as={NavLink}
|
||||
to={subLink.to}
|
||||
active={subLink.active}
|
||||
key={subLink.name}
|
||||
>
|
||||
{upperFirst(
|
||||
formatMessage({ id: subLink.name, defaultMessage: subLink.title })
|
||||
)}
|
||||
@ -64,7 +70,7 @@ const ContentTypeBuilderNav = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<SubNavLink to={link.to} active={link.active} key={link.name}>
|
||||
<SubNavLink as={NavLink} to={link.to} active={link.active} key={link.name}>
|
||||
{upperFirst(formatMessage({ id: link.name, defaultMessage: link.title }))}
|
||||
</SubNavLink>
|
||||
);
|
||||
|
||||
@ -1,11 +1,10 @@
|
||||
import React from 'react';
|
||||
import { useTracking } from '@strapi/helper-plugin';
|
||||
import { useTracking, Link } from '@strapi/helper-plugin';
|
||||
import Plus from '@strapi/icons/Plus';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import Check from '@strapi/icons/Check';
|
||||
import Pencil from '@strapi/icons/Pencil';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { Flex } from '@strapi/design-system/Flex';
|
||||
import { Stack } from '@strapi/design-system/Stack';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
|
||||
@ -0,0 +1,23 @@
|
||||
<!--- Link.stories.mdx --->
|
||||
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import Link from './index';
|
||||
|
||||
<Meta title="components/Link" component={Link} />
|
||||
|
||||
# Link
|
||||
|
||||
React-router-dom implementation of the [Strapi Design System Link](https://design-system-git-main-strapijs.vercel.app/?path=/story/design-system-components-link--base)
|
||||
|
||||
## Link
|
||||
|
||||
Basic usage
|
||||
|
||||
<Canvas>
|
||||
<Story name="base">
|
||||
<Box padding={4}>
|
||||
<Link to="/somewhere-internal">Internal link</Link>
|
||||
</Box>
|
||||
</Story>
|
||||
</Canvas>
|
||||
@ -0,0 +1,7 @@
|
||||
import React from 'react';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import { Link as DSLink } from '@strapi/design-system/v2/Link';
|
||||
|
||||
const Link = props => <DSLink {...props} as={NavLink} />;
|
||||
|
||||
export default Link;
|
||||
@ -0,0 +1,23 @@
|
||||
<!--- Link.stories.mdx --->
|
||||
|
||||
import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
|
||||
import { Box } from '@strapi/design-system/Box';
|
||||
import LinkButton from './index';
|
||||
|
||||
<Meta title="components/LinkButton" component={Link} />
|
||||
|
||||
# LinkButton
|
||||
|
||||
React-router-dom implementation of the [Strapi Design System Link Button](https://design-system-git-main-strapijs.vercel.app/?path=/story/design-system-components-linkbutton--base)
|
||||
|
||||
## LinkButton
|
||||
|
||||
Basic usage
|
||||
|
||||
<Canvas>
|
||||
<Story name="base">
|
||||
<Box padding={4}>
|
||||
<LinkButton to="/somewhere-internal">Internal link</LinkButton>
|
||||
</Box>
|
||||
</Story>
|
||||
</Canvas>
|
||||
@ -0,0 +1,7 @@
|
||||
import React from 'react';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import { LinkButton as DSLinkButton } from '@strapi/design-system/v2/LinkButton';
|
||||
|
||||
const LinkButton = props => <DSLinkButton {...props} as={NavLink} />;
|
||||
|
||||
export default LinkButton;
|
||||
@ -23,7 +23,7 @@ import {
|
||||
PageLink,
|
||||
} from '@strapi/design-system/Pagination';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { useLocation, NavLink } from 'react-router-dom';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { stringify } from 'qs';
|
||||
import useQueryParams from '../../hooks/useQueryParams';
|
||||
@ -39,7 +39,7 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
const previousSearch = makeSearch(activePage - 1);
|
||||
|
||||
const firstLinks = [
|
||||
<PageLink key={1} number={1} to={`${pathname}?${makeSearch(1)}`}>
|
||||
<PageLink as={NavLink} key={1} number={1} to={`${pathname}?${makeSearch(1)}`}>
|
||||
{formatMessage(
|
||||
{ id: 'components.pagination.go-to', defaultMessage: 'Go to page {page}' },
|
||||
{ page: 1 }
|
||||
@ -52,7 +52,12 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
.map((_, i) => i + 1)
|
||||
.map(number => {
|
||||
return (
|
||||
<PageLink key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
<PageLink
|
||||
as={NavLink}
|
||||
key={number}
|
||||
number={number}
|
||||
to={`${pathname}?${makeSearch(number)}`}
|
||||
>
|
||||
{formatMessage(
|
||||
{ id: 'components.pagination.go-to', defaultMessage: 'Go to page {page}' },
|
||||
{ page: number }
|
||||
@ -63,14 +68,14 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
return (
|
||||
<Pagination activePage={activePage} pageCount={pageCount}>
|
||||
<PreviousLink to={`${pathname}?${previousSearch}`}>
|
||||
<PreviousLink as={NavLink} to={`${pathname}?${previousSearch}`}>
|
||||
{formatMessage({
|
||||
id: 'components.pagination.go-to-previous',
|
||||
defaultMessage: 'Go to previous page',
|
||||
})}
|
||||
</PreviousLink>
|
||||
{links}
|
||||
<NextLink to={`${pathname}?${nextSearch}`}>
|
||||
<NextLink as={NavLink} to={`${pathname}?${nextSearch}`}>
|
||||
{formatMessage({
|
||||
id: 'components.pagination.go-to-next',
|
||||
defaultMessage: 'Go to next page',
|
||||
@ -87,7 +92,12 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
if (pageCount > 1) {
|
||||
lastLinks.push(
|
||||
<PageLink key={pageCount} number={pageCount} to={`${pathname}?${makeSearch(pageCount)}`}>
|
||||
<PageLink
|
||||
as={NavLink}
|
||||
key={pageCount}
|
||||
number={pageCount}
|
||||
to={`${pathname}?${makeSearch(pageCount)}`}
|
||||
>
|
||||
{formatMessage(
|
||||
{ id: 'components.pagination.go-to', defaultMessage: 'Go to page {page}' },
|
||||
{ page: pageCount }
|
||||
@ -132,7 +142,7 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
lastLinksToCreate.forEach(number => {
|
||||
lastLinks.unshift(
|
||||
<PageLink key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
<PageLink as={NavLink} key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
Go to page {number}
|
||||
</PageLink>
|
||||
);
|
||||
@ -140,7 +150,7 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
firstLinksToCreate.forEach(number => {
|
||||
firstLinks.push(
|
||||
<PageLink key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
<PageLink as={NavLink} key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
{formatMessage(
|
||||
{ id: 'components.pagination.go-to', defaultMessage: 'Go to page {page}' },
|
||||
{ page: number }
|
||||
@ -158,7 +168,12 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
middleLinksToCreate.forEach(number => {
|
||||
middleLinks.push(
|
||||
<PageLink key={number} number={number} to={`${pathname}?${makeSearch(number)}`}>
|
||||
<PageLink
|
||||
as={NavLink}
|
||||
key={number}
|
||||
number={number}
|
||||
to={`${pathname}?${makeSearch(number)}`}
|
||||
>
|
||||
{formatMessage(
|
||||
{ id: 'components.pagination.go-to', defaultMessage: 'Go to page {page}' },
|
||||
{ page: number }
|
||||
@ -181,7 +196,7 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
|
||||
return (
|
||||
<Pagination activePage={activePage} pageCount={pageCount}>
|
||||
<PreviousLink to={`${pathname}?${previousSearch}`}>
|
||||
<PreviousLink as={NavLink} to={`${pathname}?${previousSearch}`}>
|
||||
{formatMessage({
|
||||
id: 'components.pagination.go-to-previous',
|
||||
defaultMessage: 'Go to previous page',
|
||||
@ -212,7 +227,7 @@ const PaginationURLQuery = ({ pagination: { pageCount } }) => {
|
||||
</Dots>
|
||||
)}
|
||||
{lastLinks}
|
||||
<NextLink to={`${pathname}?${nextSearch}`}>
|
||||
<NextLink as={NavLink} to={`${pathname}?${nextSearch}`}>
|
||||
{formatMessage({
|
||||
id: 'components.pagination.go-to-next',
|
||||
defaultMessage: 'Go to next page',
|
||||
|
||||
@ -63,6 +63,8 @@ export { default as PaginationURLQuery } from './components/PaginationURLQuery';
|
||||
export { default as PageSizeURLQuery } from './components/PageSizeURLQuery';
|
||||
export { default as RelativeTime } from './components/RelativeTime';
|
||||
export { default as DateTimePicker } from './components/DateTimePicker';
|
||||
export { default as Link } from './components/Link';
|
||||
export { default as LinkButton } from './components/LinkButton';
|
||||
|
||||
// New icons
|
||||
export { default as SortIcon } from './icons/SortIcon';
|
||||
|
||||
@ -1,4 +1,15 @@
|
||||
import React, { useState, useRef } from 'react';
|
||||
import { Formik } from 'formik';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useRouteMatch } from 'react-router-dom';
|
||||
import {
|
||||
useOverlayBlocker,
|
||||
SettingsPageTitle,
|
||||
LoadingIndicatorPage,
|
||||
Form,
|
||||
useNotification,
|
||||
Link,
|
||||
} from '@strapi/helper-plugin';
|
||||
import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
|
||||
import { Main } from '@strapi/design-system/Main';
|
||||
import { Button } from '@strapi/design-system/Button';
|
||||
@ -9,18 +20,7 @@ import { Textarea } from '@strapi/design-system/Textarea';
|
||||
import { Typography } from '@strapi/design-system/Typography';
|
||||
import ArrowLeft from '@strapi/icons/ArrowLeft';
|
||||
import Check from '@strapi/icons/Check';
|
||||
import { Link } from '@strapi/design-system/Link';
|
||||
import { GridItem, Grid } from '@strapi/design-system/Grid';
|
||||
import { Formik } from 'formik';
|
||||
import { useIntl } from 'react-intl';
|
||||
import { useRouteMatch } from 'react-router-dom';
|
||||
import {
|
||||
useOverlayBlocker,
|
||||
SettingsPageTitle,
|
||||
LoadingIndicatorPage,
|
||||
Form,
|
||||
useNotification,
|
||||
} from '@strapi/helper-plugin';
|
||||
import UsersPermissions from '../../../components/UsersPermissions';
|
||||
import getTrad from '../../../utils/getTrad';
|
||||
import pluginId from '../../../pluginId';
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user