Skip to content

Commit f3fc80c

Browse files
authored
Upgrade primer/components -> primer/react (#25591)
* upgrade primer/components -> primer/react * fix jest failure
1 parent b7f0987 commit f3fc80c

28 files changed

+135
-95
lines changed

components/Search.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import React, { useState, useEffect, useRef, ReactNode, RefObject } from 'react'
22
import { useRouter } from 'next/router'
33
import useSWR from 'swr'
44
import cx from 'classnames'
5-
import { ActionList, DropdownMenu, Flash, Label, Overlay } from '@primer/components'
6-
import { ItemInput } from '@primer/components/lib/ActionList/List'
5+
import { ActionList, DropdownMenu, Flash, Label, Overlay } from '@primer/react'
6+
import { ItemInput } from '@primer/react/lib/ActionList/List'
77

88
import { useTranslation } from 'components/hooks/useTranslation'
99
import { sendEvent, EventType } from 'components/lib/events'

components/article/ArticleGridLayout.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react'
22
import styled from 'styled-components'
3-
import { Box, themeGet } from '@primer/components'
3+
import { Box, themeGet } from '@primer/react'
44

55
type Props = {
66
intro?: React.ReactNode

components/article/ArticlePage.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { useState, useEffect } from 'react'
22
import { useRouter } from 'next/router'
33
import dynamic from 'next/dynamic'
44
import cx from 'classnames'
5-
import { ActionList, Heading } from '@primer/components'
5+
import { ActionList, Heading } from '@primer/react'
66

77
import { ZapIcon, InfoIcon, ShieldLockIcon } from '@primer/octicons-react'
88
import { Callout } from 'components/ui/Callout'

components/article/PlatformPicker.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useEffect, useState } from 'react'
22
import Cookies from 'js-cookie'
3-
import { SubNav, TabNav, UnderlineNav } from '@primer/components'
3+
import { SubNav, TabNav, UnderlineNav } from '@primer/react'
44
import { sendEvent, EventType } from 'components/lib/events'
55
import { useRouter } from 'next/router'
66

components/article/ToolPicker.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useEffect, useState } from 'react'
22
import Cookies from 'js-cookie'
3-
import { UnderlineNav } from '@primer/components'
3+
import { UnderlineNav } from '@primer/react'
44
import { sendEvent, EventType } from 'components/lib/events'
55
import { preserveAnchorNodePosition } from 'scroll-anchoring'
66

components/guides/ArticleCard.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { ArticleGuide } from 'components/context/ProductGuidesContext'
2-
import { Label } from '@primer/components'
2+
import { Label } from '@primer/react'
33

44
type Props = {
55
card: ArticleGuide

components/guides/ArticleCards.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import React, { useEffect, useRef, useState } from 'react'
33
import { ArticleGuide, useProductGuidesContext } from 'components/context/ProductGuidesContext'
44
import { useTranslation } from 'components/hooks/useTranslation'
55
import { ArticleCard } from './ArticleCard'
6-
import { DropdownMenu } from '@primer/components'
7-
import { ItemInput } from '@primer/components/lib/ActionList/List'
6+
import { DropdownMenu } from '@primer/react'
7+
import { ItemInput } from '@primer/react/lib/ActionList/List'
88

99
const PAGE_SIZE = 9
1010
export const ArticleCards = () => {

components/guides/LearningTrack.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import cx from 'classnames'
22
import { useTranslation } from 'components/hooks/useTranslation'
33
import { ArrowRightIcon } from '@primer/octicons-react'
4-
import { ActionList } from '@primer/components'
4+
import { ActionList } from '@primer/react'
55
import { useState } from 'react'
66
import { FeaturedTrack } from 'components/context/ProductGuidesContext'
77
import { TruncateLines } from 'components/ui/TruncateLines'

components/hooks/useBreakpoint.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { useTheme } from '@primer/components'
1+
import { useTheme } from '@primer/react'
22

33
import { useMediaQuery } from './useMediaQuery'
44

components/landing/ArticleList.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import cx from 'classnames'
22
import dayjs from 'dayjs'
3-
import { ActionList } from '@primer/components'
3+
import { ActionList } from '@primer/react'
44
import { useTranslation } from 'components/hooks/useTranslation'
55
import { Link } from 'components/Link'
66
import { ArrowRightIcon } from '@primer/octicons-react'

components/landing/CodeExampleCard.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { RepoIcon } from '@primer/octicons-react'
22
import { CodeExample } from 'components/context/ProductLandingContext'
33
import { TruncateLines } from 'components/ui/TruncateLines'
4-
import { Label } from '@primer/components'
4+
import { Label } from '@primer/react'
55

66
type Props = {
77
example: CodeExample

components/landing/CodeExamples.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useEffect, useState } from 'react'
22
import { ArrowRightIcon, SearchIcon } from '@primer/octicons-react'
3-
import { Text } from '@primer/components'
3+
import { Text } from '@primer/react'
44

55
import { useProductLandingContext } from 'components/context/ProductLandingContext'
66
import { useTranslation } from 'components/hooks/useTranslation'

components/landing/ProductArticlesList.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import cx from 'classnames'
22
import { useState } from 'react'
33

44
import { ChevronDownIcon } from '@primer/octicons-react'
5-
import { ActionList } from '@primer/components'
5+
import { ActionList } from '@primer/react'
66

77
import { ProductTreeNode, useMainContext } from 'components/context/MainContext'
88
import { Link } from 'components/Link'

components/landing/TableOfContents.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useRouter } from 'next/router'
22
import cx from 'classnames'
33

4-
import { ActionList } from '@primer/components'
4+
import { ActionList } from '@primer/react'
55
import { Link } from 'components/Link'
66
import { BumpLink } from 'components/ui/BumpLink'
77
import type { TocItem } from 'components/context/ProductLandingContext'

components/page-header/DeprecationBanner.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useMainContext } from 'components/context/MainContext'
22
import { useVersion } from 'components/hooks/useVersion'
3-
import { Flash } from '@primer/components'
3+
import { Flash } from '@primer/react'
44

55
export const DeprecationBanner = () => {
66
const { data, enterpriseServerReleases } = useMainContext()

components/page-header/RestBanner.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react'
2-
import { Flash } from '@primer/components'
2+
import { Flash } from '@primer/react'
33
import { useRouter } from 'next/router'
44
import { Link } from 'components/Link'
55

components/playground/ArticleMarkdown.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react'
22
import cx from 'classnames'
3-
import { useTheme } from '@primer/components'
3+
import { useTheme } from '@primer/react'
44
import ReactMarkdown from 'react-markdown'
55
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'
66
import { vs, vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism'

components/playground/CodeLanguagePicker.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SelectMenu, Button, Dropdown } from '@primer/components'
1+
import { SelectMenu, Button, Dropdown } from '@primer/react'
22
import { Link } from 'components/Link'
33
import { useRouter } from 'next/router'
44
import { usePlaygroundContext } from 'components/context/PlaygroundContext'

components/playground/editor/ActionBar.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { CopyIcon, CheckIcon } from '@primer/octicons-react'
2-
import { Tooltip } from '@primer/components'
2+
import { Tooltip } from '@primer/react'
33

44
import useClipboard from 'components/hooks/useClipboard'
55

components/playground/editor/Editor.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { LoadingIndicator } from './LoadingIndicator'
88
import { ActionBar } from './ActionBar'
99

1010
import { CodeBlockRef, PlaygroundArticleT } from '../types'
11-
import { useTheme } from '@primer/components'
11+
import { useTheme } from '@primer/react'
1212

1313
const getNormalizedHighlight = (
1414
highlight: Exclude<CodeBlockRef['highlight'], undefined>

components/playground/editor/LoadingIndicator.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Box, Text } from '@primer/components'
1+
import { Box, Text } from '@primer/react'
22

33
export function LoadingIndicator() {
44
return (

components/sidebar/SidebarHomepage.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useRouter } from 'next/router'
22
import { LinkExternalIcon } from '@primer/octicons-react'
3-
import { ActionList } from '@primer/components'
3+
import { ActionList } from '@primer/react'
44

55
import { useVersion } from 'components/hooks/useVersion'
66
import { useMainContext } from 'components/context/MainContext'

components/sidebar/SidebarProduct.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { useRouter } from 'next/router'
22
import cx from 'classnames'
33
import { useState, useEffect, SyntheticEvent } from 'react'
44
import { ChevronDownIcon } from '@primer/octicons-react'
5-
import { ActionList } from '@primer/components'
5+
import { ActionList } from '@primer/react'
66

77
import { Link } from 'components/Link'
88
import { ProductTreeNode, useMainContext } from 'components/context/MainContext'

components/ui/Picker/Picker.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { ReactNode } from 'react'
22
import cx from 'classnames'
33

4-
import { Details, useDetails, Text, Dropdown, Box } from '@primer/components'
4+
import { Details, useDetails, Text, Dropdown, Box } from '@primer/react'
55
import { ChevronDownIcon } from '@primer/octicons-react'
66

77
export type PickerOptionsTypeT = {

jest.config.js

+4
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,10 @@ module.exports = {
2323
},
2424
},
2525
preset: isBrowser ? 'jest-puppeteer' : undefined,
26+
moduleNameMapper: {
27+
// fix for "Unexpected token 'export'" error when running jest
28+
'@primer/behaviors': '<rootDir>/node_modules/@primer/behaviors/dist/cjs/index.js',
29+
},
2630
reporters,
2731
modulePathIgnorePatterns: ['assets/'],
2832
setupFilesAfterEnv: ['@alex_neo/jest-expect-message'],

0 commit comments

Comments
 (0)