♻️(frontend) use next/router instead of next/navigation
The last upgrade of next.js gives a warning when we were using next/navigation with the pages router. This commit fixes this issue.
This commit is contained in:
@@ -5,7 +5,7 @@ import { AppWrapper } from '@/tests/utils';
|
|||||||
|
|
||||||
import Page from '../pages';
|
import Page from '../pages';
|
||||||
|
|
||||||
jest.mock('next/navigation', () => ({
|
jest.mock('next/router', () => ({
|
||||||
useRouter() {
|
useRouter() {
|
||||||
return {
|
return {
|
||||||
push: jest.fn(),
|
push: jest.fn(),
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import { Alert, Loader, VariantType } from '@openfun/cunningham-react';
|
import { Alert, Loader, VariantType } from '@openfun/cunningham-react';
|
||||||
import { useRouter as useNavigate } from 'next/navigation';
|
|
||||||
import { useRouter } from 'next/router';
|
import { useRouter } from 'next/router';
|
||||||
import React, { useEffect } from 'react';
|
import React, { useEffect } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
@@ -100,7 +99,7 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => {
|
|||||||
});
|
});
|
||||||
const { createProvider, providers } = useDocStore();
|
const { createProvider, providers } = useDocStore();
|
||||||
|
|
||||||
const navigate = useNavigate();
|
const { replace } = useRouter();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!version?.id) {
|
if (!version?.id) {
|
||||||
@@ -115,7 +114,7 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => {
|
|||||||
|
|
||||||
if (isError && error) {
|
if (isError && error) {
|
||||||
if (error.status === 404) {
|
if (error.status === 404) {
|
||||||
navigate.replace(`/404`);
|
void replace(`/404`);
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import {
|
|||||||
useToastProvider,
|
useToastProvider,
|
||||||
} from '@openfun/cunningham-react';
|
} from '@openfun/cunningham-react';
|
||||||
import { t } from 'i18next';
|
import { t } from 'i18next';
|
||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/router';
|
||||||
|
|
||||||
import { Box, Text, TextErrors } from '@/components';
|
import { Box, Text, TextErrors } from '@/components';
|
||||||
import useCunninghamTheme from '@/cunningham/useCunninghamTheme';
|
import useCunninghamTheme from '@/cunningham/useCunninghamTheme';
|
||||||
@@ -24,7 +24,7 @@ interface ModalRemoveDocProps {
|
|||||||
export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => {
|
export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => {
|
||||||
const { colorsTokens } = useCunninghamTheme();
|
const { colorsTokens } = useCunninghamTheme();
|
||||||
const { toast } = useToastProvider();
|
const { toast } = useToastProvider();
|
||||||
const router = useRouter();
|
const { push } = useRouter();
|
||||||
|
|
||||||
const {
|
const {
|
||||||
mutate: removeDoc,
|
mutate: removeDoc,
|
||||||
@@ -35,7 +35,7 @@ export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => {
|
|||||||
toast(t('The document has been deleted.'), VariantType.SUCCESS, {
|
toast(t('The document has been deleted.'), VariantType.SUCCESS, {
|
||||||
duration: 4000,
|
duration: 4000,
|
||||||
});
|
});
|
||||||
router.push('/');
|
void push('/');
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import {
|
|||||||
useToastProvider,
|
useToastProvider,
|
||||||
} from '@openfun/cunningham-react';
|
} from '@openfun/cunningham-react';
|
||||||
import { t } from 'i18next';
|
import { t } from 'i18next';
|
||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/router';
|
||||||
import * as Y from 'yjs';
|
import * as Y from 'yjs';
|
||||||
|
|
||||||
import { Box, Text } from '@/components';
|
import { Box, Text } from '@/components';
|
||||||
@@ -31,14 +31,14 @@ export const ModalVersion = ({
|
|||||||
versionId,
|
versionId,
|
||||||
}: ModalVersionProps) => {
|
}: ModalVersionProps) => {
|
||||||
const { toast } = useToastProvider();
|
const { toast } = useToastProvider();
|
||||||
const router = useRouter();
|
const { push } = useRouter();
|
||||||
const { providers } = useDocStore();
|
const { providers } = useDocStore();
|
||||||
const { mutate: updateDoc } = useUpdateDoc({
|
const { mutate: updateDoc } = useUpdateDoc({
|
||||||
listInvalideQueries: [KEY_LIST_DOC_VERSIONS],
|
listInvalideQueries: [KEY_LIST_DOC_VERSIONS],
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
const onDisplaySuccess = () => {
|
const onDisplaySuccess = () => {
|
||||||
toast(t('Version restored successfully'), VariantType.SUCCESS);
|
toast(t('Version restored successfully'), VariantType.SUCCESS);
|
||||||
router.push(`/docs/${docId}`);
|
void push(`/docs/${docId}`);
|
||||||
};
|
};
|
||||||
|
|
||||||
if (!providers?.[docId] || !providers?.[versionId]) {
|
if (!providers?.[docId] || !providers?.[versionId]) {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { Button } from '@openfun/cunningham-react';
|
import { Button } from '@openfun/cunningham-react';
|
||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/router';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
@@ -12,12 +12,12 @@ import { DocsGrid } from './DocsGrid';
|
|||||||
export const DocsGridContainer = () => {
|
export const DocsGridContainer = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const { untitledDocument } = useTrans();
|
const { untitledDocument } = useTrans();
|
||||||
const router = useRouter();
|
const { push } = useRouter();
|
||||||
const { isMobile } = useResponsiveStore();
|
const { isMobile } = useResponsiveStore();
|
||||||
|
|
||||||
const { mutate: createDoc } = useCreateDoc({
|
const { mutate: createDoc } = useCreateDoc({
|
||||||
onSuccess: (doc) => {
|
onSuccess: (doc) => {
|
||||||
router.push(`/docs/${doc.id}`);
|
void push(`/docs/${doc.id}`);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import {
|
|||||||
VariantType,
|
VariantType,
|
||||||
useToastProvider,
|
useToastProvider,
|
||||||
} from '@openfun/cunningham-react';
|
} from '@openfun/cunningham-react';
|
||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/router';
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
@@ -35,7 +35,7 @@ export const MemberItem = ({
|
|||||||
const { isSmallMobile, screenWidth } = useResponsiveStore();
|
const { isSmallMobile, screenWidth } = useResponsiveStore();
|
||||||
const [localRole, setLocalRole] = useState(role);
|
const [localRole, setLocalRole] = useState(role);
|
||||||
const { toast } = useToastProvider();
|
const { toast } = useToastProvider();
|
||||||
const router = useRouter();
|
const { push } = useRouter();
|
||||||
const { mutate: updateDocAccess, error: errorUpdate } = useUpdateDocAccess({
|
const { mutate: updateDocAccess, error: errorUpdate } = useUpdateDocAccess({
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
toast(t('The role has been updated'), VariantType.SUCCESS, {
|
toast(t('The role has been updated'), VariantType.SUCCESS, {
|
||||||
@@ -55,7 +55,7 @@ export const MemberItem = ({
|
|||||||
);
|
);
|
||||||
|
|
||||||
if (isMyself) {
|
if (isMyself) {
|
||||||
router.push('/');
|
void push('/');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { Loader } from '@openfun/cunningham-react';
|
import { Loader } from '@openfun/cunningham-react';
|
||||||
import { useQueryClient } from '@tanstack/react-query';
|
import { useQueryClient } from '@tanstack/react-query';
|
||||||
import Head from 'next/head';
|
import Head from 'next/head';
|
||||||
import { useRouter as useNavigate } from 'next/navigation';
|
|
||||||
import { useRouter } from 'next/router';
|
import { useRouter } from 'next/router';
|
||||||
import { useEffect, useState } from 'react';
|
import { useEffect, useState } from 'react';
|
||||||
|
|
||||||
@@ -46,7 +45,7 @@ const DocPage = ({ id }: DocProps) => {
|
|||||||
const { setCurrentDoc, createProvider, providers } = useDocStore();
|
const { setCurrentDoc, createProvider, providers } = useDocStore();
|
||||||
const { setBroadcastProvider, addTask } = useBroadcastStore();
|
const { setBroadcastProvider, addTask } = useBroadcastStore();
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
const navigate = useNavigate();
|
const { replace } = useRouter();
|
||||||
const provider = providers?.[id];
|
const provider = providers?.[id];
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -101,7 +100,7 @@ const DocPage = ({ id }: DocProps) => {
|
|||||||
|
|
||||||
if (isError && error) {
|
if (isError && error) {
|
||||||
if (error.status === 404) {
|
if (error.status === 404) {
|
||||||
navigate.replace(`/404`);
|
void replace(`/404`);
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user