feat: updates

packages/web/components/New/ContextMenus/TrackContextMenu.tsx

@@ -0,0 +1,99 @@
+import contextMenus, { closeContextMenu } from '@/web/states/contextMenus'
+import { AnimatePresence } from 'framer-motion'
+import toast from 'react-hot-toast'
+import { useNavigate } from 'react-router-dom'
+import { useCopyToClipboard } from 'react-use'
+import { useSnapshot } from 'valtio'
+import BasicContextMenu from './BasicContextMenu'
+
+const TrackContextMenu = () => {
+  const navigate = useNavigate()
+  const [, copyToClipboard] = useCopyToClipboard()
+
+  const { type, dataSourceID, target, cursorPosition, options } =
+    useSnapshot(contextMenus)
+
+  return (
+    <AnimatePresence>
+      {type === 'track' && dataSourceID && target && cursorPosition && (
+        <BasicContextMenu
+          target={target}
+          cursorPosition={cursorPosition}
+          onClose={closeContextMenu}
+          options={options}
+          items={[
+            {
+              type: 'item',
+              label: 'Add to Queue',
+              onClick: () => {
+                toast('开发中')
+              },
+            },
+            {
+              type: 'divider',
+            },
+            {
+              type: 'item',
+              label: 'Go to artist',
+              onClick: () => {
+                toast('开发中')
+              },
+            },
+            {
+              type: 'item',
+              label: 'Go to album',
+              onClick: () => {
+                toast('开发中')
+              },
+            },
+            {
+              type: 'divider',
+            },
+            {
+              type: 'item',
+              label: 'Add to Liked Tracks',
+              onClick: () => {
+                toast('开发中')
+              },
+            },
+            {
+              type: 'item',
+              label: 'Add to playlist',
+              onClick: () => {
+                toast('开发中')
+              },
+            },
+            {
+              type: 'submenu',
+              label: 'Share',
+              items: [
+                {
+                  type: 'item',
+                  label: 'Copy Netease Link',
+                  onClick: () => {
+                    copyToClipboard(
+                      `https://music.163.com/#/album?id=${dataSourceID}`
+                    )
+                    toast.success('Copied')
+                  },
+                },
+                {
+                  type: 'item',
+                  label: 'Copy YPM Link',
+                  onClick: () => {
+                    copyToClipboard(
+                      `${window.location.origin}/album/${dataSourceID}`
+                    )
+                    toast.success('Copied')
+                  },
+                },
+              ],
+            },
+          ]}
+        />
+      )}
+    </AnimatePresence>
+  )
+}
+
+export default TrackContextMenu