feat(WEB-304): remaning UI from design system primitives

components/MyPages/Blocks/Shortcuts/index.tsx

@@ -1,4 +1,4 @@
-import Image from "@/components/Image"
+import { ArrowRightIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 
 import Header from "../Header"
@@ -8,28 +8,29 @@ import styles from "./shortcuts.module.css"
 import type { ShortcutsProps } from "@/types/components/myPages/myPage/shortcuts"
 
 export default function Shortcuts({
+  firstItem = false,
   shortcuts,
   subtitle,
   title,
 }: ShortcutsProps) {
   return (
     <section className={styles.shortcuts}>
-      <Header link={undefined} subtitle={subtitle} title={title} />
+      <Header
+        link={undefined}
+        subtitle={subtitle}
+        title={title}
+        topTitle={firstItem}
+      />
       <section className={styles.links}>
         {shortcuts.map((shortcut) => (
           <Link
-            className={styles.link}
             href={shortcut.url}
             key={shortcut.title}
             target={shortcut.openInNewTab ? "_blank" : undefined}
+            variant="shortcut"
           >
             <span>{shortcut.text ? shortcut.text : shortcut.title}</span>
-            <Image
-              alt="Chevron Icon"
-              height={20}
-              src="/_static/icons/chevron.svg"
-              width={20}
-            />
+            <ArrowRightIcon />
           </Link>
         ))}
       </section>