Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: upgrade nextjs to latest version 14 (#312) #567

Merged
merged 10 commits into from
Feb 26, 2024
Merged

chore: upgrade nextjs to latest version 14 (#312) #567

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
91879a6
chore: updated node and storybook (#312)
Feb 21, 2024
3de1385
chore: updated storybook (#312)
Feb 21, 2024
ddcc9e5
wip
Feb 21, 2024
8867067
fix: updated useRequestFileLocation hook to handle react 18 in dev mo…
Feb 22, 2024
8e6eb19
chore: udpated axios (#312)
Feb 22, 2024
45a76ef
chore: typescript 4.6.4 (#312)
Feb 22, 2024
da81b3b
chore: removed unwanted packages (#312)
Feb 23, 2024
409ffd0
chore: updated typescript (#312)
Feb 26, 2024
aeeb81f
chore: reverted typescript to v4.6.4 (#312)
Feb 26, 2024
2eef982
fix: storybook (#312)
Feb 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/data-explorer-ui/.storybook/preview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import { CssBaseline } from "@mui/material";
import { ThemeProvider } from "@mui/material/styles";
import { ThemeProvider as Emotion10ThemeProvider } from "emotion-theming";
import { RouterContext } from "next/dist/shared/lib/router-context";
import { useConfig } from "../src//hooks/useConfig";
import { RouterContext } from "next/dist/shared/lib/router-context.shared-runtime";
import { useConfig } from "../src/hooks/useConfig";
import "../src/index";
import { createAppTheme } from "../src/theme/theme";

Expand Down
45,313 changes: 19,347 additions & 25,966 deletions packages/data-explorer-ui/package-lock.json
View file
Open in desktop

Large diffs are not rendered by default.

45 changes: 25 additions & 20 deletions packages/data-explorer-ui/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,39 +21,41 @@
"homepage": "https://github.com/clevercanary/data-explorer/tree/main/packages/data-explorer-ui#readme",
"main": "lib/index.js",
"devDependencies": {
"@next/eslint-plugin-next": "^13.1.6",
"@storybook/addon-actions": "^7.0.7",
"@storybook/addon-essentials": "^7.0.7",
"@storybook/addon-interactions": "^7.0.7",
"@storybook/addon-links": "^7.0.7",
"@storybook/addon-mdx-gfm": "^7.0.7",
"@storybook/nextjs": "^7.0.7",
"@storybook/react": "^7.0.7",
"@storybook/testing-library": "^0.1.0",
"@next/eslint-plugin-next": "^14.1.0",
"@storybook/addon-actions": "^7.6.17",
"@storybook/addon-essentials": "^7.6.17",
"@storybook/addon-interactions": "^7.6.17",
"@storybook/addon-links": "^7.6.17",
"@storybook/addon-mdx-gfm": "^7.6.17",
"@storybook/nextjs": "^7.6.17",
"@storybook/react": "^7.6.17",
"@storybook/testing-library": "^0.2.2",
"@storybook/types": "^7.6.17",
"@types/jest": "^29.4.0",
"@types/react": "^18.0.15",
"@types/react": "^18.2.57",
"@types/react-dom": "^18.2.19",
"@types/react-gtm-module": "^2.0.1",
"@types/react-window": "^1.8.5",
"@types/uuid": "8.3.4",
"@typescript-eslint/eslint-plugin": "^5.49.0",
"eslint": "^8.33.0",
"eslint-config-next": "^13.1.6",
"eslint-config-next": "^14.1.0",
"eslint-config-prettier": "^8.6.0",
"eslint-plugin-eslint-comments": "^3.2.0",
"eslint-plugin-jsdoc": "^39.7.4",
"eslint-plugin-jsdoc": "^48.1.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-sonarjs": "^0.18.0",
"eslint-plugin-sort-destructure-keys": "^1.4.0",
"eslint-plugin-storybook": "^0.6.11",
"eslint-plugin-typescript-sort-keys": "^2.1.0",
"eslint-plugin-storybook": "^0.8.0",
"eslint-plugin-typescript-sort-keys": "^2.3.0",
"jest": "^29.4.1",
"jest-environment-jsdom": "^29.4.1",
"prettier": "^2.8.3",
"prettier-plugin-organize-imports": "^3.2.2",
"storybook": "^7.0.7",
"storybook": "^7.6.17",
"ts-jest": "^29.0.5",
"typescript": "^4.9.4"
"typescript": "^4.6.4"
},
"peerDependencies": {
"@emotion/react": "11.11.1",
Expand All @@ -62,17 +64,20 @@
"@mui/material": "5.14.1",
"@tanstack/react-table": "8.5.11",
"@tanstack/react-virtual": "^3.0.0-beta.59",
"axios": "1.3.5",
"axios": "^1.6.7",
"copy-to-clipboard": "3.3.1",
"isomorphic-dompurify": "0.24.0",
"next": "12.3.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"next": "^14.1.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-dropzone": "^14.2.3",
"react-gtm-module": "2.0.11",
"react-idle-timer": "^5.6.2",
"react-window": "1.8.9",
"uuid": "8.3.2",
"validate.js": "^0.13.1"
},
"engines": {
"node": "20.10.0"
}
}
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Error/error.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ export const Error = ({
</SectionContent>
{rootPath && (
<SectionActions>
<Link href={rootPath} passHref>
<Link href={rootPath} legacyBehavior passHref>
<ButtonPrimary
onClick={handleToHomePageClicked}
href="passHref"
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Export/components/ExportMethod/exportMethod.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export const ExportMethod = ({
<SectionActions>
<Tooltip arrow title={message}>
<span>
<Link href={route} passHref>
<Link href={route} legacyBehavior passHref>
<ExportButton disabled={disabled || !isAccessible}>
{buttonLabel}
</ExportButton>
Expand Down
2 changes: 1 addition & 1 deletion ...explorer-ui/src/components/Index/components/Hero/components/ExportButton/exportButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export const ExportButton = (): JSX.Element => {
return (
<Tooltip arrow title={message}>
<span>
<Link href="/export" passHref>
<Link href="/export" legacyBehavior passHref>
<Button disabled={disabled || isLoading} href="passHref">
Export
</Button>
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Layout/components/Footer/footer.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export default {
layout: "fullscreen",
},
title: "Components/Layout/Footer",
} satisfies Meta<typeof Footer>;
} as Meta<typeof Footer>;

type Story = StoryObj<typeof Footer>;

Expand Down
2 changes: 1 addition & 1 deletion ...ns/components/Authentication/components/AuthenticationMenu/authenticationMenu.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export default {
},
component: AuthenticationMenu,
title: "Components/Navigation/AuthenticationMenu",
} satisfies Meta<typeof AuthenticationMenu>;
} as Meta<typeof AuthenticationMenu>;

const AuthenticationMenuTemplate: StoryFn<typeof AuthenticationMenu> = (
args
Expand Down
2 changes: 1 addition & 1 deletion ...er-ui/src/components/Layout/components/Header/components/Content/components/Logo/logo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export const Logo = ({
<StaticImage alt={alt} height={height} src={src} width={width} />
);
return isClientSideNavigation(link) ? (
<Link href={link} passHref>
<Link href={link} legacyBehavior passHref>
<a className={className} href="passHref" rel="noopener" target={target}>
{logo}
</a>
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Layout/components/Header/header.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export default {
layout: "fullscreen",
},
title: "Components/Layout/Header",
} satisfies Meta<typeof Header>;
} as Meta<typeof Header>;

type Story = StoryObj<typeof Header>;

Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Layout/components/Nav/nav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ export const Nav = ({ Hero, navigation }: NavProps): JSX.Element => {
{navigation.map(({ active, label, url }, i) => {
return (
<ListItem key={`${label}${i}`}>
<Link href={url ?? ""} passHref>
<Link href={url ?? ""} legacyBehavior passHref>
<ListItemButton disabled={!url} selected={active}>
<ListItemText disableTypography primary={label} />
</ListItemButton>
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Links/components/Link/link.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export const Link = ({
<>
{isClientSideNavigation(url) ? (
<>
<NLink href={url} passHref>
<NLink href={url} legacyBehavior passHref>
<MLink
className={className}
rel="noopener"
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/Project/components/Contacts/contacts.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export const Contacts = ({ contacts }: ContactsProps): JSX.Element => {
<Typography variant="text-body-500-2lines">{name}</Typography>
{institution && <span>{institution}</span>}
{email && (
<Link href={`mailto:${email}`} passHref>
<Link href={`mailto:${email}`} legacyBehavior passHref>
<EmailLink>{email}</EmailLink>
</Link>
)}
Expand Down
6 changes: 5 additions & 1 deletion ...ata-explorer-ui/src/components/Project/components/DataReleasePolicy/dataReleasePolicy.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,11 @@ export const DataReleasePolicy = (): JSX.Element => {
<CollapsableSection title="Data Access Policy">
<Typography>
For information regarding data sharing and data use, please see our{" "}
<Link href="https://anvilproject.org/faq/data-security/" passHref>
<Link
href="https://anvilproject.org/faq/data-security/"
legacyBehavior
passHref
>
<PolicyLink target="_blank">Data Access Policy</PolicyLink>
</Link>
.
Expand Down
2 changes: 1 addition & 1 deletion ...omponents/Support/components/SupportRequest/components/SupportRequestForm/common/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ export async function uploadAttachment<T extends File>(
* @returns response.
*/
async function fetchWithErrorRejection(
input: RequestInfo | URL,
input: string,
options?: RequestInit
): Promise<Response> {
const res = await fetch(input, options);
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/common/Alert/alert.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default {
},
component: Alert,
title: "Components/Common/Alert",
} satisfies Meta<typeof Alert>;
} as Meta<typeof Alert>;

type Story = StoryObj<typeof Alert>;

Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/common/Breadcrumbs/breadcrumbs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export const Breadcrumbs = ({
<MBreadcrumbs className={className} separator={Separator}>
{breadcrumbs.map(({ path, text }, b) =>
path ? (
<Link key={`${path}${b}`} href={path} passHref>
<Link key={`${path}${b}`} href={path} legacyBehavior passHref>
<BreadcrumbLink>{text}</BreadcrumbLink>
</Link>
) : (
Expand Down
2 changes: 1 addition & 1 deletion ...orer-ui/src/components/common/Button/components/CallToActionButton/callToActionButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export const CallToActionButton = ({
const { label, target, url } = callToAction;
const isInternal = isClientSideNavigation(url);
return isInternal ? (
<NLink href={url} passHref>
<NLink href={url} legacyBehavior passHref>
<Button
className={className}
disabled={disabled}
Expand Down
2 changes: 1 addition & 1 deletion ...ata-explorer-ui/src/components/common/Button/components/HelpIconButton/helpIconButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export const HelpIconButton = ({
}: HelpIconButtonProps): JSX.Element => {
const isInternal = isClientSideNavigation(url);
return isInternal ? (
<Link href={url} passHref>
<Link href={url} legacyBehavior passHref>
<Button
href="passHref"
rel="noopener"
Expand Down
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/common/Code/code.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { Code } from "./code";
const meta = {
component: Code,
title: "Components/Common/Code",
} satisfies Meta<typeof Code>;
} as Meta<typeof Code>;

export default meta;

Expand Down
16 changes: 7 additions & 9 deletions packages/data-explorer-ui/src/components/common/CopyToClipboard/copyToClipboard.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { ComponentMeta, ComponentStory } from "@storybook/react";
import * as React from "react";
import { Meta, StoryObj } from "@storybook/react";
import { CopyToClipboard } from "./copyToClipboard";

export default {
Expand All @@ -10,13 +9,12 @@ export default {
},
component: CopyToClipboard,
title: "Components/Common/CopyToClipboard",
} satisfies ComponentMeta<typeof CopyToClipboard>;
} as Meta<typeof CopyToClipboard>;

const CopyToClipboardTemplate: ComponentStory<typeof CopyToClipboard> = (
args
) => <CopyToClipboard {...args} />;
type Story = StoryObj<typeof CopyToClipboard>;

export const CopyToClipboardStory = CopyToClipboardTemplate.bind({});
CopyToClipboardStory.args = {
copyStr: "Copy me",
export const CopyToClipboardStory: Story = {
args: {
copyStr: "Copy me",
},
};
2 changes: 1 addition & 1 deletion packages/data-explorer-ui/src/components/common/Socials/socials.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export default {
},
component: Socials,
title: "Components/Navigation/SocialLinks",
} satisfies Meta<typeof Socials>;
} as Meta<typeof Socials>;

type Story = StoryObj<typeof Socials>;

Expand Down
1 change: 0 additions & 1 deletion packages/data-explorer-ui/src/entity/service/factory.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import * as apiEntityService from "../api/service";
import * as apicfEntityService from "../apicf/service";
import * as entityService from "../common/service";
import * as tsvEntityService from "../tsv/service";

import { EntityService, EntityServiceType } from "./model";

const API_ENTITY_SERVICE: EntityService = {
Expand Down
12 changes: 6 additions & 6 deletions packages/data-explorer-ui/src/hooks/useRequestFileLocation.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,14 +136,14 @@ export const useRequestFileLocation = (
isSuccess,
run: runAsync,
} = useAsync<FileLocation>();
const active = useRef(true);
const active = useRef<boolean>(true);

useEffect(
() => () => {
useEffect(() => {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated the useEffect to set the active ref to true on component mount. React v18+ simulates unmounting and remounting the component in development mode.

active.current = true;
return () => {
active.current = false;
},
[]
);
};
}, []);

const run = useCallback(() => {
if (url) {
Expand Down
Loading