fix: update Octicons

Author: reggi

src/components/page-footer.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import {Box, Octicon, Avatar, Text} from '@primer/react'
+import {Box, Avatar, Text} from '@primer/react'
 import {Tooltip} from '@primer/react/next'
 import {PencilIcon} from '@primer/octicons-react'
 import Link from './link'
@@ -75,7 +75,7 @@ const PageFooter = () => {
       <Box sx={{display: 'grid', gap: 4}}>
         {editUrl ? (
           <Link href={editUrl}>
-            <Octicon icon={PencilIcon} sx={{mr: 2}} />
+            <PencilIcon sx={{mr: 2}} />
             Edit this page on GitHub
           </Link>
         ) : null}

src/mdx/code.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import {Box, Text, Button, Octicon, themeGet} from '@primer/react'
+import {Box, Text, Button, themeGet} from '@primer/react'
 import {Highlight, themes, Prism} from 'prism-react-renderer'
 import styled from 'styled-components'
 import {CheckIcon, CopyIcon} from '@primer/octicons-react'
@@ -31,7 +31,7 @@ const ClipboardCopy = ({value, ...props}) => {
         announce(`Copied to clipboard`)
       }}
     >
-      <Octicon icon={copied ? CheckIcon : CopyIcon} sx={{color: copied ? 'success.fg' : 'fg.muted'}} />
+      {copied ? <CheckIcon color="success.fg" /> : <CopyIcon color="fg.muted" />}
     </Button>
   )
 }

src/mdx/components.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import {Box, Heading, themeGet, Octicon} from '@primer/react'
+import {Box, Heading, themeGet} from '@primer/react'
 import styled from 'styled-components'
 import {variant as styledVariant} from 'styled-system'
 import {LinkIcon} from '@primer/octicons-react'
@@ -43,8 +43,7 @@ const HeaderLink = ({autolink, children, ...props}) =>
   autolink ? (
     <LinkNoUnderline {...props} sx={{color: 'inherit'}}>
       {children}
-      <Octicon
-        icon={LinkIcon}
+      <LinkIcon
         className="octicon-link"
         sx={{
           ml: 2,