Working release

.eslintrc.cjs

@@ -22,5 +22,6 @@ module.exports = {
     quotes: ["error", "double"],
     "react/react-in-jsx-scope": "off",
     "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
   },
 }

README.md

@@ -1,7 +1,40 @@
-# Tauri + React + Typescript
 
-This template should help get you started developing with Tauri, React and Typescript in Vite.
+# VKM: VK Music Player
 
-## Recommended IDE Setup
+VKM это десктопный музыкальный плеер для VK.com, написанный на React с использованием Rust-tauri.
 
-- [VS Code](https://code.visualstudio.com/) + [Tauri](https://marketplace.visualstudio.com/items?itemName=tauri-apps.tauri-vscode) + [rust-analyzer](https://marketplace.visualstudio.com/items?itemName=rust-lang.rust-analyzer)
+
+
+
+## Компиляция
+
+- Для начала проект нужно склонировать в любую папку
+- Для сборки нужны: yarn, Rust
+```bash
+  cd VKM
+  yarn && yarn tauri build
+```
+Результат будет в папке _VKM/src-tauri/target/release/bundle_
+
+## Авторизация
+Для авторизации используется клиент _VK Admin for iOS_, и с помощью blank.html страницы получается токен пользователя с доступом к методам музыки
+
+Мы хотели получить нормальный токен для работы с музыкой, но поддержка ВК вежливо направила нас в нужное место
+## Функционал
+
+- [x]  Авторизация (через костыль)
+- [x]  Поиск музыки
+- [x]  Получение "Моей музыки"
+- [x]  Воспроизведение аудио
+- [x]  Получение обложек для превью
+- [x]  Плей/Пауза
+- [ ]  Переключение между треками
+- [ ]  Случайный порядок
+- [ ]  Повтор
+- [ ]  Плейлисты
+- [ ]  Рекомендации
+- [ ]  Нормальный прогрессбар для трека
+- [ ]  Нормальная Авторизация
+- [ ]  Музыка друзей
+- [ ]  Эквалайзер
+- [ ]  Темы оформления

src-tauri/tauri.conf.json

@@ -33,7 +33,7 @@
     },
     "bundle": {
       "active": true,
-      "category": "DeveloperTool",
+      "category": "Music",
       "copyright": "",
       "deb": {
         "depends": []
@@ -46,7 +46,7 @@
         "icons/icon.icns",
         "icons/icon.ico"
       ],
-      "identifier": "com.tauri.dev",
+      "identifier": "com.faglomxf.vkm",
       "longDescription": "",
       "macOS": {
         "entitlements": null,

src/components/CaptchaHandler.tsx

@@ -7,35 +7,35 @@ import {
   TextField,
 } from "@mui/material"
 
-const CaptchaHandler = ({ value, url, valSetter, onSubmit, onCancel }) => (
-  <Dialog maxWidth="xs" open={url.length > 0}>
+const CaptchaHandler = ( props: { value: string, url: string, valSetter: any, onSubmit: any, onCancel: any }) => (
+  <Dialog maxWidth="xs" open={props.url.length > 0}>
     <DialogTitle>Captcha required</DialogTitle>
     <DialogContent>
       <Grid container alignItems="center" spacing={3}>
         <Grid item xs={12}>
-          <img src={url} alt="captcha" width={"100%"} />
+          <img src={props.url} alt="captcha" width={"100%"} />
         </Grid>
         <Grid item xs={12}>
           <TextField
             placeholder="Captcha"
             variant="outlined"
             fullWidth
-            value={value}
-            onChange={(e) => valSetter(e.target.value)}
+            value={props.value}
+            onChange={(e) => props.valSetter(e.target.value)}
           />
         </Grid>
         <Grid item xs={12}>
           <Button
             variant="contained"
             fullWidth
-            disabled={value.length === 0}
-            onClick={onSubmit}
+            disabled={props.value.length === 0}
+            onClick={props.onSubmit}
           >
             Submit
           </Button>
         </Grid>
         <Grid item xs={12}>
-          <Button variant="contained" fullWidth onClick={onCancel}>
+          <Button variant="contained" fullWidth onClick={props.onCancel}>
             Cancel
           </Button>
         </Grid>

src/components/Player.tsx

@@ -127,12 +127,12 @@ function Player() {
     }
   }
 
-  const positionChange = (e, val: any) => {
+  const positionChange = (e: any, val: any) => {
     console.log("positionChange", val)
     updateTime(val)
   }
 
-  const volumeChange = (e, val: any) => {
+  const volumeChange = (e: any, val: any) => {
     updateVolume(val)
     console.log("volumeChange", val)
   }

src/hooks/useLocalStore.tsx

@@ -17,6 +17,7 @@ export function useLocalStore(key: string, defaultValue: string, storeName = ".v
   const timeoutRef = useRef<any>(null);
 
   // useLayoutEffect will be called before DOM paintings and before useEffect
+  // @ts-ignore
   useLayoutEffect(() => {
     let allow = true;
     store.get(key)