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.

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

refactor: [M3-8642] - Migrate Button to UI package #11250

Merged
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Paper } from '@linode/ui';
import { Divider, Paper } from '@linode/ui';
import * as React from 'react';
import { makeStyles } from 'tss-react/mui';

Expand All @@ -21,7 +21,6 @@ import { Typography } from 'src/components/Typography';
import { useRegionsQuery } from 'src/queries/regions/regions';
import { doesRegionSupportFeature } from 'src/utilities/doesRegionSupportFeature';

import { Divider } from '@linode/ui';
import UserSSHKeyPanel from './UserSSHKeyPanel';

import type { Theme } from '@mui/material/styles';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import { Button } from '@linode/ui';
import { useTheme } from '@mui/material/styles';
import * as React from 'react';
import { makeStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';
import { Checkbox } from 'src/components/Checkbox';
import { Table } from 'src/components/Table';
import { TableBody } from 'src/components/TableBody';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { StyledLinkButton } from '@linode/ui';
import Warning from '@mui/icons-material/CheckCircle';
import { createLazyRoute } from '@tanstack/react-router';
import * as React from 'react';
Expand All @@ -7,8 +8,6 @@ import { ErrorState } from 'src/components/ErrorState/ErrorState';
import { Typography } from 'src/components/Typography';
import { SupportTicketDialog } from 'src/features/Support/SupportTickets/SupportTicketDialog';

import { StyledLinkButton } from '../Button/StyledLinkButton';

import type { AttachmentError } from 'src/features/Support/SupportTicketDetail/SupportTicketDetail';

const AccountActivationLanding = () => {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,9 @@
import { Box } from '@linode/ui';
import { Box, Button } from '@linode/ui';
import { styled } from '@mui/material/styles';
import * as React from 'react';
import { useStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';

import type { BoxProps } from '@linode/ui';
import type { ButtonProps } from 'src/components/Button/Button';
import type { BoxProps, ButtonProps } from '@linode/ui';

interface ActionButtonsProps extends ButtonProps {
'data-node-idx'?: number;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { Button } from '@linode/ui';
import userEvent from '@testing-library/user-event';
import React from 'react';

import { renderWithTheme } from 'src/utilities/testHelpers';

import { Button } from '../Button/Button';
import { AkamaiBanner } from './AkamaiBanner';

import type { Flags } from 'src/featureFlags';
Expand Down
3 changes: 1 addition & 2 deletions packages/manager/src/components/CheckoutBar/styles.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { Button } from '@linode/ui';
import { styled, useTheme } from '@mui/material/styles';

import { Button } from 'src/components/Button/Button';

const StyledButton = styled(Button)(({ theme }) => ({
marginTop: 18,
[theme.breakpoints.up('lg')]: {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { Button } from '@linode/ui';
import * as React from 'react';

import { Button } from 'src/components/Button/Button';
import { Link } from 'src/components/Link';
import { Typography } from 'src/components/Typography';

Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
import { Notice } from '@linode/ui';
import { Notice, StyledLinkButton } from '@linode/ui';
import { styled } from '@mui/material/styles';

import { StyledLinkButton } from '../Button/StyledLinkButton';

export const StyledNotice = styled(Notice, { label: 'StyledNotice' })(
({ theme }) => ({
'&&': {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Button } from '@linode/ui';
import { fireEvent } from '@testing-library/react';
import * as React from 'react';

import { Button } from 'src/components/Button/Button';
import { Typography } from 'src/components/Typography';
import { renderWithTheme } from 'src/utilities/testHelpers';

Expand Down
5 changes: 2 additions & 3 deletions packages/manager/src/components/DownloadCSV/DownloadCSV.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import { Button, StyledLinkButton } from '@linode/ui';
import * as React from 'react';
import { CSVLink } from 'react-csv';

import DownloadIcon from 'src/assets/icons/lke-download.svg';
import { Button } from 'src/components/Button/Button';
import { StyledLinkButton } from 'src/components/Button/StyledLinkButton';

import type { ButtonType } from '@linode/ui';
import type { SxProps, Theme } from '@mui/material/styles';
import type { ButtonType } from 'src/components/Button/Button';

interface DownloadCSVProps {
buttonType?: 'styledLink' | ButtonType;
Expand Down
5 changes: 3 additions & 2 deletions packages/manager/src/components/Drawer.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
import { Button } from '@linode/ui';
import { action } from '@storybook/addon-actions';
import { Meta, StoryObj } from '@storybook/react';
import React from 'react';

import { ActionsPanel } from './ActionsPanel/ActionsPanel';
import { Button } from './Button/Button';
import { Drawer } from './Drawer';
import { TextField } from './TextField';
import { Typography } from './Typography';

import type { Meta, StoryObj } from '@storybook/react';

const meta: Meta<typeof Drawer> = {
component: Drawer,
title: 'Components/Drawer',
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import { Box } from '@linode/ui';
import { Box, Button, fadeIn } from '@linode/ui';
import Edit from '@mui/icons-material/Edit';
import { styled } from '@mui/material/styles';

import { Button } from 'src/components/Button/Button';
import { TextField } from 'src/components/TextField';
import { Typography } from 'src/components/Typography';
import { fadeIn } from 'src/styles/keyframes';

import type { EditableTextVariant } from './EditableInput';
import type { TextFieldProps } from 'src/components/TextField';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,16 +1,18 @@
import { Button } from '@linode/ui';
import Check from '@mui/icons-material/Check';
import Close from '@mui/icons-material/Close';
import Edit from '@mui/icons-material/Edit';
import { Theme } from '@mui/material/styles';
import * as React from 'react';
import { Link } from 'react-router-dom';
import { makeStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';
import { ClickAwayListener } from 'src/components/ClickAwayListener';
import { H1Header } from 'src/components/H1Header/H1Header';

import { TextField, TextFieldProps } from '../TextField';
import { TextField } from '../TextField';

import type { TextFieldProps } from '../TextField';
import type { Theme } from '@mui/material/styles';

const useStyles = makeStyles<void, 'editIcon' | 'icon'>()(
(theme: Theme, _params, classes) => ({
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import { Box } from '@linode/ui';
import { Box, Button } from '@linode/ui';
import { styled } from '@mui/material/styles';
import * as React from 'react';

import Minus from 'src/assets/icons/LKEminusSign.svg';
import Plus from 'src/assets/icons/LKEplusSign.svg';
import { Button } from 'src/components/Button/Button';
import { TextField } from 'src/components/TextField';

const sxTextFieldBase = {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import { Box } from '@linode/ui';
import { Box, Button } from '@linode/ui';
import { action } from '@storybook/addon-actions';
import React from 'react';

import { EntityHeader } from 'src/components/EntityHeader/EntityHeader';
import { Hidden } from 'src/components/Hidden';
import { LinodeActionMenu } from 'src/features/Linodes/LinodesLanding/LinodeActionMenu/LinodeActionMenu';

import { Button } from '../Button/Button';
import { Link } from '../Link';

import type { Meta, StoryObj } from '@storybook/react';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { Button } from '@linode/ui';
import ErrorOutline from '@mui/icons-material/ErrorOutline';
import { styled, useTheme } from '@mui/material/styles';
import Grid from '@mui/material/Unstable_Grid2';
import * as React from 'react';

import { Button } from 'src/components/Button/Button';
import { Typography } from 'src/components/Typography';

import type { SvgIconProps } from '../SvgIcon';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import { Notice, Stack } from '@linode/ui';
import { Button, Notice, Stack } from '@linode/ui';
import React from 'react';

import { useFlags } from 'src/hooks/useFlags';
import { replaceNewlinesWithLineBreaks } from 'src/utilities/replaceNewlinesWithLineBreaks';

import { Button } from '../Button/Button';
import { Dialog } from '../Dialog/Dialog';
import { ErrorMessage } from '../ErrorMessage';
import { LinearProgress } from '../LinearProgress';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { Theme } from '@mui/material/styles';
import { Button } from '@linode/ui';
import * as React from 'react';
import { Link } from 'react-router-dom';
import { makeStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';
import { SvgIcon } from 'src/components/SvgIcon';
import type { Theme } from '@mui/material/styles';
import type { SvgIcon } from 'src/components/SvgIcon';

const useStyles = makeStyles()((theme: Theme) => ({
active: {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
/* eslint-disable react/jsx-no-useless-fragment */
import { StyledActionButton } from '@linode/ui';
import { styled } from '@mui/material/styles';
import * as React from 'react';
import { Link } from 'react-router-dom';

import { StyledActionButton } from 'src/components/Button/StyledActionButton';

interface InlineMenuActionProps {
/** Required action text */
actionText: string;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Button } from '@linode/ui';
import { action } from '@storybook/addon-actions';
import React from 'react';

import { Button } from '../Button/Button';
import { LandingHeader } from './LandingHeader';

import type { Meta, StoryObj } from '@storybook/react';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { Theme, styled, useTheme } from '@mui/material/styles';
import { Button } from '@linode/ui';
import { styled, useTheme } from '@mui/material/styles';
import Grid from '@mui/material/Unstable_Grid2';
import useMediaQuery from '@mui/material/useMediaQuery';
import * as React from 'react';

import BetaFeedbackIcon from 'src/assets/icons/icon-feedback.svg';
import {
Breadcrumb,
BreadcrumbProps,
} from 'src/components/Breadcrumb/Breadcrumb';
import { Button } from 'src/components/Button/Button';
import { Breadcrumb } from 'src/components/Breadcrumb/Breadcrumb';
import { DocsLink } from 'src/components/DocsLink/DocsLink';

import type { Theme } from '@mui/material/styles';
import type { BreadcrumbProps } from 'src/components/Breadcrumb/Breadcrumb';

export interface LandingHeaderProps {
analyticsLabel?: string;
betaFeedbackLink?: string;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { omittedProps } from '@linode/ui';
import { Button, omittedProps } from '@linode/ui';
import { styled } from '@mui/material/styles';

import { Button } from 'src/components/Button/Button';
import { Table } from 'src/components/Table';
import { TableBody } from 'src/components/TableBody';
import { TableCell } from 'src/components/TableCell';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { omittedProps } from '@linode/ui';
import { Button, omittedProps } from '@linode/ui';
import { styled } from '@mui/material/styles';

import { Button } from 'src/components/Button/Button';
import { Table } from 'src/components/Table';
import { TableCell } from 'src/components/TableCell';

Expand Down
4 changes: 1 addition & 3 deletions packages/manager/src/components/LinkButton.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
import { Box, CircleProgress } from '@linode/ui';
import { Box, CircleProgress, StyledLinkButton } from '@linode/ui';
import * as React from 'react';
import { makeStyles } from 'tss-react/mui';

import { StyledLinkButton } from './Button/StyledLinkButton';

import type { Theme } from '@mui/material/styles';

const useStyles = makeStyles()((theme: Theme) => ({
Expand Down
3 changes: 1 addition & 2 deletions packages/manager/src/components/MaintenanceScreen.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { Stack } from '@linode/ui';
import { Box } from '@linode/ui';
import { Box, Stack } from '@linode/ui';
import BuildIcon from '@mui/icons-material/Build';
import { useTheme } from '@mui/material/styles';
import * as React from 'react';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import { InputLabel, Notice } from '@linode/ui';
import { Button, InputLabel, Notice } from '@linode/ui';
import Close from '@mui/icons-material/Close';
import Grid from '@mui/material/Unstable_Grid2';
import * as React from 'react';
import { makeStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';
import { LinkButton } from 'src/components/LinkButton';
import { StyledLinkButtonBox } from 'src/components/SelectFirewallPanel/SelectFirewallPanel';
import { TextField } from 'src/components/TextField';
Expand Down
5 changes: 2 additions & 3 deletions packages/manager/src/components/Placeholder/Placeholder.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,14 @@
import { Button, fadeIn } from '@linode/ui';
import { styled, useTheme } from '@mui/material/styles';
import * as React from 'react';

import LinodeIcon from 'src/assets/addnewmenu/linode.svg';
import { Button } from 'src/components/Button/Button';
import { H1Header } from 'src/components/H1Header/H1Header';
import { Typography } from 'src/components/Typography';
import { fadeIn } from 'src/styles/keyframes';

import { TransferDisplay } from '../TransferDisplay/TransferDisplay';

import type { ButtonProps } from 'src/components/Button/Button';
import type { ButtonProps } from '@linode/ui';

export interface ExtendedButtonProps extends ButtonProps {
target?: string;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/* eslint-disable @typescript-eslint/no-empty-function */
import { Button } from '@linode/ui';
import * as React from 'react';

import { Button } from '../Button/Button';
import { RemovableSelectionsList } from './RemovableSelectionsList';

import type { RemovableItem } from './RemovableSelectionsList';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { Button } from '@linode/ui';
import { fireEvent } from '@testing-library/react';
import * as React from 'react';

import { renderWithTheme } from 'src/utilities/testHelpers';

import { Button } from '../Button/Button';
import { RemovableSelectionsList } from './RemovableSelectionsList';

const defaultList = Array.from({ length: 5 }, (_, index) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ import {
StyledScrollBox,
} from './RemovableSelectionsList.style';

import type { ButtonProps } from '@linode/ui';
import type { SxProps, Theme } from '@mui/material';
import type { ButtonProps } from 'src/components/Button/Button';

export type RemovableItem = {
// The remaining key-value pairs must have their values typed
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { Button } from '@linode/ui';
import KeyboardArrowRight from '@mui/icons-material/KeyboardArrowRight';
import Collapse from '@mui/material/Collapse';
import { Theme } from '@mui/material/styles';
import * as React from 'react';
import { makeStyles } from 'tss-react/mui';

import { Button } from 'src/components/Button/Button';
import type { Theme } from '@mui/material/styles';

const useStyles = makeStyles<void, 'caret'>()(
(theme: Theme, _params, classes) => ({
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import { Stack } from '@linode/ui';
import { Button, Stack } from '@linode/ui';
import { useSnackbar } from 'notistack';
import React from 'react';

import { Button } from 'src/components/Button/Button';
import { Snackbar } from 'src/components/Snackbar/Snackbar';
import { getEventMessage } from 'src/features/Events/utils';

Expand Down
Loading