refactor: reuse APM's ChromeStorage

package.json

@@ -30,8 +30,8 @@
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "@types/uuid": "^9.0.8",
-    "@typescript-eslint/eslint-plugin": "^7.13.0",
-    "@typescript-eslint/parser": "^7.13.0",
+    "@typescript-eslint/eslint-plugin": "^7.13.1",
+    "@typescript-eslint/parser": "^7.13.1",
     "@welldone-software/why-did-you-render": "^8.0.3",
     "babel-loader": "^9.1.3",
     "clean-webpack-plugin": "^4.0.0",
@@ -117,7 +117,7 @@
     "react-hotkeys-hook": "^4.5.0",
     "react-i18next": "^14.1.2",
     "react-jinke-music-player": "git+https://[email protected]/lovegaoshi/react-music-player.git",
-    "react-lrc": "^3.2.0",
+    "react-lrc": "^3.2.1",
     "react-swipeable": "^7.0.1",
     "react-window": "^1.8.10",
     "stream-browserify": "^3.0.0",

src/components/Playlist/PlaylistHeader/PlaylistHeader.tsx

@@ -3,7 +3,7 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Typography from '@mui/material/Typography';
 
-import { PlaylistTypes } from '@enums/Playlist';
+import { PlaylistTypes } from '@APM/enums/Playlist';
 import useApp from '@stores/useApp';
 import { UsePlaylistP } from '../hooks/usePlaylistPaginated';
 import RandomGIFIcon from './RandomGIF';

src/components/Playlist/PlaylistHeader/PlaylistSelectButton.tsx

@@ -5,7 +5,7 @@ import CropSquareIcon from '@mui/icons-material/CropSquare';
 import DeselectIcon from '@mui/icons-material/Deselect';
 import SelectAllIcon from '@mui/icons-material/SelectAll';
 
-import { SortOptions } from '@enums/Playlist';
+import { SortOptions } from '@APM/enums/Playlist';
 import PlaylistSortButton from './PlaylistSortButton';
 
 interface UsePlaylist {

src/components/Playlist/PlaylistHeader/PlaylistSortButton.tsx

@@ -7,7 +7,7 @@ import Checkbox from '@mui/material/Checkbox';
 import FormGroup from '@mui/material/FormGroup';
 
 import GenericSelectDialog from '@components/dialogs/GenericSelectDialog';
-import { SortOptions } from '@enums/Playlist';
+import { SortOptions } from '@APM/enums/Playlist';
 
 interface Props {
   sortPlaylist: (

src/components/Playlist/SongMenu.js

@@ -14,7 +14,7 @@ import 'react-contexify/dist/ReactContexify.css';
 
 import { getName } from '@APM/utils/re';
 import usePlaylistCRUD from '@APM/hooks/usePlaylistCRUD';
-import { SearchRegex } from '@enums/Playlist';
+import { SearchRegex } from '@APM/enums/Playlist';
 import { BiliBiliIconSVG, goToBiliBili } from '../bilibiliIcon';
 import {
   searchSongOnWeb,

src/components/Playlist/hooks/usePlaylistPaginated.ts

@@ -4,7 +4,7 @@ import { useHotkeys } from 'react-hotkeys-hook';
 import { useNoxSetting } from '@APM/stores/useApp';
 import usePlaylist, { UsePlaylist } from '@APM/hooks/usePlaylist';
 import { syncFavlist } from '@utils/Bilibili/bilifavOperate';
-import { PlaylistTypes } from '@enums/Playlist';
+import { PlaylistTypes } from '@APM/enums/Playlist';
 import { logger } from '@utils/Logger';
 
 export interface UsePlaylistP extends UsePlaylist {

src/components/buttons/PlayerResetButton.tsx

@@ -3,7 +3,7 @@ import Button from '@mui/material/Button';
 import ReplayIcon from '@mui/icons-material/Replay';
 import { useConfirm } from 'material-ui-confirm';
 
-import { clearStorage } from '@utils/ChromeStorage';
+import { clearStorage } from '@utils/ChromeStorageAPI';
 
 export default function PlayerResetButton() {
   const confirm = useConfirm();

src/components/setting/SyncSetting.tsx

@@ -6,7 +6,7 @@ import { useStore } from 'zustand';
 
 import useApp from '@stores/useApp';
 import playerSettingStore from '@APM/stores/playerSettingStore';
-import { SyncOptions } from '@objects/Storage';
+import { SyncOptions } from '@enums/Storage';
 import useInitializeStore from '@stores/useInitializeStore';
 import {
   ExportSyncFavButton as PersonalExportSyncFavButton,

src/components/setting/sync/GenericSyncButton.tsx

@@ -7,7 +7,7 @@ import { useSnackbar } from 'notistack';
 import CircularProgress from '@mui/material/CircularProgress';
 import { SxProps } from '@mui/material';
 
-import { exportStorageRaw } from '@utils/ChromeStorage';
+import { exportPlayerContent } from '@utils/ChromeStorageAPI';
 
 interface ImportPropsR extends NoxSyncComponent.ImportProps {
   sx: SxProps;
@@ -94,7 +94,7 @@ function ExportSyncFavButton({ noxBackup, login, sx }: ExportPropsR) {
   };
 
   const cloudUpload = async () => {
-    const exportedDict = await exportStorageRaw();
+    const exportedDict = await exportPlayerContent();
     const response = await noxBackup(exportedDict);
     if (response.status === 200 || response.status === 201) {
       enqueueSnackbar('歌单上传到云端成功！', {

src/components/setting/sync/LocalSyncButton.tsx

@@ -7,7 +7,7 @@ import { useSnackbar } from 'notistack';
 import Tooltip from '@mui/material/Tooltip';
 
 import useInitializeStore from '@stores/useInitializeStore';
-import { exportStorageRaw } from '@utils/ChromeStorage';
+import { exportPlayerContent } from '@utils/ChromeStorageAPI';
 
 interface SyncFavButtonProps {
   AddFavIcon: Object;
@@ -48,7 +48,7 @@ export function ImportFavButton({ AddFavIcon }: SyncFavButtonProps) {
 }
 
 const exportStorage = async () => {
-  const bytes = await exportStorageRaw();
+  const bytes = await exportPlayerContent();
   const blobBytes = new Blob([bytes], {
     type: 'application/json;charset=utf-8',
   });

src/components/setting/sync/PersonalSyncButton.tsx

@@ -9,7 +9,7 @@ import TextField from '@mui/material/TextField';
 
 import { noxBackup, noxRestore } from '@utils/sync/PersonalCloudAuth';
 import useInitializeStore from '@stores/useInitializeStore';
-import { exportStorageRaw } from '@utils/ChromeStorage';
+import { exportPlayerContent } from '@utils/ChromeStorageAPI';
 
 interface SyncFavButtonProps {
   AddFavIcon: Object;
@@ -83,7 +83,7 @@ export function ExportSyncFavButton({
 
   const cloudUpload = async () => {
     setLoading(true);
-    const exportedDict = await exportStorageRaw();
+    const exportedDict = await exportPlayerContent();
     const response = await noxBackup(exportedDict, cloudAddress);
     if (response.status === 200) {
       enqueueSnackbar('歌单上传到私有云成功！', {

src/hooks/useLyric.ts

@@ -1,5 +1,5 @@
 import useLyric from '@APM/hooks/useLyric';
-import { LrcSource } from '@enums/LyricFetch';
+import { LrcSource } from '@APM/enums/LyricFetch';
 
 // HACK: instead of a local lrc cache, just use a simple global var cache...?
 // TODO: make a proper cache

src/hooks/usePlayback.ts

@@ -6,7 +6,7 @@ import { useNoxSetting } from '@APM/stores/useApp';
 import useApp from '@stores/useApp';
 import { parseSongList } from '@objects/Playlist';
 import renderExtendsContent from '@components/App/ExtendContent';
-import { Source } from '@enums/MediaFetch';
+import { Source } from '@APM/enums/MediaFetch';
 import { DEFAULT_NULL_URL } from '@objects/Song';
 import { MUSICFREE } from '@utils/mediafetch/musicfree';
 import r128gain from '../utils/ffmpeg/r128util';
@@ -246,12 +246,10 @@ export default () => {
       songList.findIndex((s) => s.id === currentPlayingId),
     );
     const song = songList[previousPlayingSongIndex];
-    if (song !== undefined) {
-      options.extendsContent = renderExtendsContent(song);
-    }
+    options.extendsContent =
+      song !== undefined ? renderExtendsContent(song) : [];
     const newParams = {
       ...options,
-      extendsContent: song && renderExtendsContent(song),
       ...playerSetting,
       audioLists: songList,
       defaultPlayIndex: previousPlayingSongIndex,

src/objects/Storage.ts

@@ -1,7 +1,5 @@
-import {
-  DefaultSetting as _DefaultSetting,
-  SyncOptions,
-} from '@APM/enums/Storage';
+import { SyncOptions } from '@APM/enums/Storage';
+import { DefaultSetting as _DefaultSetting } from '@APM/objects/Storage';
 
 export { SyncOptions } from '@APM/enums/Storage';
 
@@ -28,6 +26,6 @@ export const DefaultSetting: NoxStorage.PlayerSettingDict = {
   memoryEfficiency: true,
 };
 
-export const NPOverwriteSetting = {
+export const OverrideSetting = {
   // memoryEfficiency: false,
 };

src/styles/skin.ts

@@ -1,4 +1,4 @@
-import { getPlayerSetting } from '@utils/ChromeStorage';
+import { getSettings } from '@APM/utils/ChromeStorage';
 import { buttonStyle, ScrollBar } from '@hooks/useTheme';
 import AzusaTheme from './skins/azusa';
 import ItsukiTheme from './skins/itsuki';
@@ -19,7 +19,7 @@ import LumiTheme from './skins/lumi';
 import KeroroTheme from './skins/keroro';
 
 // needs to enable top-level await; necessary for other modules to import current skin config
-const setting = await getPlayerSetting();
+const setting = await getSettings();
 // http://192.168.50.1:19527/getimg?imgserve=itsuki&file=herabanner.png
 
 export const SkinMap: { [key: string]: () => any } = {