diff --git a/manager-ui/.eslintrc.cjs b/manager-ui/.eslintrc.cjs
index 9edfb7b..2254a5a 100644
--- a/manager-ui/.eslintrc.cjs
+++ b/manager-ui/.eslintrc.cjs
@@ -37,5 +37,6 @@ module.exports = {
react: {
version: 'detect'
}
- }
+ },
+ ignorePatterns: ['wasm/', 'dist/']
};
diff --git a/manager-ui/src/WebApp.tsx b/manager-ui/src/WebApp.tsx
index 24546a5..b506871 100644
--- a/manager-ui/src/WebApp.tsx
+++ b/manager-ui/src/WebApp.tsx
@@ -1,7 +1,11 @@
///
import React, { useState } from 'react';
-import { generate_soundcore_service_uuids, getSoundcoreMacPrefixes, WebBLEDevice } from '@wasm/manager_wasm';
+import {
+ generate_soundcore_service_uuids,
+ getSoundcoreMacPrefixes,
+ WebBLEDevice
+} from '@wasm/manager_wasm';
import { useWebManagerStore } from '@stores/web/useWebManagerStore';
import { DeviceStateCard } from '@components/DeviceStateCard/deviceStateCard';
import { SoundModeCard } from '@components/SoundModeCard/soundModeCard';
@@ -10,7 +14,6 @@ import { Box } from '@mui/material';
import { EqualizerCard } from '@components/EqualizerCard/equalizerCard';
export const WebApp: React.FC = () => {
-
const state = useWebManagerStore((state) => state.currentState);
const setDevice = useWebManagerStore((state) => state.setDevice);
const [isConnecting, setIsConnecting] = useState(false);
@@ -21,7 +24,6 @@ export const WebApp: React.FC = () => {
const soundcoreServiceUuids = generate_soundcore_service_uuids();
const companyIdentifiers = getSoundcoreMacPrefixes();
try {
-
const device = await navigator.bluetooth.requestDevice({
filters: companyIdentifiers.map((prefix) => ({
manufacturerData: [
@@ -56,4 +58,4 @@ export const WebApp: React.FC = () => {
)}
);
-};
\ No newline at end of file
+};
diff --git a/manager-ui/src/ble/bleDevice.ts b/manager-ui/src/ble/bleDevice.ts
index e4184d4..ef629e3 100644
--- a/manager-ui/src/ble/bleDevice.ts
+++ b/manager-ui/src/ble/bleDevice.ts
@@ -29,4 +29,4 @@ export class BLEDevice {
public async setEqualizerPreset(profile: EQProfile): Promise {
return this.webBLEDevice.setEqualizerPreset(JSON.stringify(profile));
}
-}
\ No newline at end of file
+}
diff --git a/manager-ui/src/components/DeviceStateCard/deviceStateCard.tsx b/manager-ui/src/components/DeviceStateCard/deviceStateCard.tsx
index d93300e..485d850 100644
--- a/manager-ui/src/components/DeviceStateCard/deviceStateCard.tsx
+++ b/manager-ui/src/components/DeviceStateCard/deviceStateCard.tsx
@@ -7,18 +7,13 @@ import React from 'react';
export const DeviceStateCard: React.FC<{
state: SoundcoreDeviceState | null;
}> = ({ state }) => {
-
return (
<>
-
+ elevation={0}>
+
>
diff --git a/manager-ui/src/components/EqualizerCard/equalizerCard.tsx b/manager-ui/src/components/EqualizerCard/equalizerCard.tsx
index dce960d..717e4d0 100644
--- a/manager-ui/src/components/EqualizerCard/equalizerCard.tsx
+++ b/manager-ui/src/components/EqualizerCard/equalizerCard.tsx
@@ -12,9 +12,9 @@ export interface EqualizerCardProps {
}
export const EqualizerCard = ({ state }: EqualizerCardProps): JSX.Element => {
- const deviceAddrOrDevice: BluetoothAdrr | BLEDevice | null = window.isTauri ?
- useTauriManagerStore((state) => state.currentViewedDevice) :
- useWebManagerStore((state) => state.device);
+ const deviceAddrOrDevice: BluetoothAdrr | BLEDevice | null = window.isTauri
+ ? useTauriManagerStore((state) => state.currentViewedDevice)
+ : useWebManagerStore((state) => state.device);
if (!deviceAddrOrDevice) {
return <>>;
@@ -25,7 +25,7 @@ export const EqualizerCard = ({ state }: EqualizerCardProps): JSX.Element => {
const onCustomEqualizerChange = useCallback((output: number[]) => {
if (isOnCustom) {
- const new_eq = output.map(v => v * 10);
+ const new_eq = output.map((v) => v * 10);
useUpdateCustomEqualizer(deviceAddrOrDevice, new_eq);
}
}, []);
@@ -73,12 +73,11 @@ export const EqualizerCard = ({ state }: EqualizerCardProps): JSX.Element => {
{state.featureSet.equalizerFeatures && (
diff --git a/manager-ui/src/components/SoundModeCard/soundModeCard.tsx b/manager-ui/src/components/SoundModeCard/soundModeCard.tsx
index 0e06fc4..895bdef 100644
--- a/manager-ui/src/components/SoundModeCard/soundModeCard.tsx
+++ b/manager-ui/src/components/SoundModeCard/soundModeCard.tsx
@@ -4,7 +4,12 @@ import ANCIcon from '@assets/ambient_icon_anc.png';
import NormalIcon from '@assets/ambient_icon_off.png';
import TransIcon from '@assets/ambient_icon_trans.png';
import React, { useCallback, useEffect, useState } from 'react';
-import { BluetoothAdrr, CurrentSoundMode, SoundcoreDeviceState, SoundMode } from '@generated-types/soundcore-lib';
+import {
+ BluetoothAdrr,
+ CurrentSoundMode,
+ SoundcoreDeviceState,
+ SoundMode
+} from '@generated-types/soundcore-lib';
import { useUpdateDeviceSoundMode } from '@hooks/useDeviceCommand';
import { useWebManagerStore } from '@stores/web/useWebManagerStore';
import { BLEDevice } from '../../ble/bleDevice';
@@ -27,11 +32,17 @@ export const SoundModeCard = ({ state }: SoundModeCardProps): JSX.Element => {
}
} = state;
- const deviceAddrOrDevice: BluetoothAdrr | BLEDevice | null = window.isTauri ?
- useTauriManagerStore((state) => state.currentViewedDevice) :
- useWebManagerStore((state) => state.device);
+ const deviceAddrOrDevice: BluetoothAdrr | BLEDevice | null = window.isTauri
+ ? useTauriManagerStore((state) => state.currentViewedDevice)
+ : useWebManagerStore((state) => state.device);
- if (!soundModeState || !deviceAddrOrDevice || !ancFeatures || !transparencyFeatures || !hasNormalMode) {
+ if (
+ !soundModeState ||
+ !deviceAddrOrDevice ||
+ !ancFeatures ||
+ !transparencyFeatures ||
+ !hasNormalMode
+ ) {
return <>>;
}
@@ -151,8 +162,7 @@ export const SoundModeCard = ({ state }: SoundModeCardProps): JSX.Element => {
minWidth: 275,
justifyContent: 'center',
alignItems: 'center'
- }}
- >
+ }}>
@@ -166,9 +176,7 @@ export const SoundModeCard = ({ state }: SoundModeCardProps): JSX.Element => {
position="left"
icon={ANCIcon}
setSliderIcon={setIcon}
- setSliderPosition={() =>
- handleCurrentSoundModeChange(CurrentSoundMode.ANC)
- }
+ setSliderPosition={() => handleCurrentSoundModeChange(CurrentSoundMode.ANC)}
/>
)}
{hasNormalMode && (
@@ -176,9 +184,7 @@ export const SoundModeCard = ({ state }: SoundModeCardProps): JSX.Element => {
position="center"
icon={NormalIcon}
setSliderIcon={setIcon}
- setSliderPosition={() =>
- handleCurrentSoundModeChange(CurrentSoundMode.Normal)
- }
+ setSliderPosition={() => handleCurrentSoundModeChange(CurrentSoundMode.Normal)}
/>
)}
{transparencyFeatures.length > 0 && (
@@ -234,14 +240,12 @@ const ModeGroupButtons: React.FC<{
container
direction="row"
spacing={1}
- sx={{ display: 'flex', justifyContent: 'space-evenly', pt: 2 }}
- >
+ sx={{ display: 'flex', justifyContent: 'space-evenly', pt: 2 }}>
{buttons.map((button) => (
onClick(button.value)}
- >
+ onClick={() => onClick(button.value)}>
{button.title}
))}
@@ -261,7 +265,7 @@ const ModeGroupButton = styled(Button, {
export type AllowedSliderPositions = 'left' | 'right' | 'center';
const SliderSelectorWrapper = styled('div')(({ theme }) => ({
- width: (window.innerWidth - 35) - (window.innerWidth - 35) / 3,
+ width: window.innerWidth - 35 - (window.innerWidth - 35) / 3,
height: 55,
display: 'flex',
flexDirection: 'row',
@@ -285,17 +289,17 @@ const SliderSelector = styled('div', {
height: 53,
alignItems: 'center',
justifyContent: 'center',
- width: ((window.innerWidth - 35) - (window.innerWidth - 35) / 3) / 3,
+ width: (window.innerWidth - 35 - (window.innerWidth - 35) / 3) / 3,
elevation: 4,
shadowColor: 'black',
shadowRadius: 10,
shadowOpacity: 0.31,
transition: 'transform 0.32s cubic-bezier(0.87, 0, 0.13, 1)',
...(position == 'left' && {
- transform: `translateX(-${((window.innerWidth - 35) - (window.innerWidth - 35) / 3) / 3}px)`
+ transform: `translateX(-${(window.innerWidth - 35 - (window.innerWidth - 35) / 3) / 3}px)`
}),
...(position == 'right' && {
- transform: `translateX(${(((window.innerWidth - 35) - (window.innerWidth - 35) / 3) / 3)}px)`
+ transform: `translateX(${(window.innerWidth - 35 - (window.innerWidth - 35) / 3) / 3}px)`
}),
...(position == 'center' && {
transform: 'translateX(0)'
@@ -307,7 +311,7 @@ const SliderButtonInner = styled(Button, {
})<{ position: AllowedSliderPositions }>(({ position }) => ({
display: 'flex',
flex: 1,
- width: ((window.innerWidth - 35) - (window.innerWidth - 35) / 3) / 3,
+ width: (window.innerWidth - 35 - (window.innerWidth - 35) / 3) / 3,
height: 54,
justifyContent: 'center',
alignItems: 'center',
@@ -335,8 +339,7 @@ const SliderButton: React.FC<{
onClick={() => {
setSliderPosition && setSliderPosition(position);
setSliderIcon(icon);
- }}
- >
+ }}>
diff --git a/manager-ui/src/hooks/useDeviceCommand.tsx b/manager-ui/src/hooks/useDeviceCommand.tsx
index 466ea27..60644ea 100644
--- a/manager-ui/src/hooks/useDeviceCommand.tsx
+++ b/manager-ui/src/hooks/useDeviceCommand.tsx
@@ -18,7 +18,10 @@ export const useUpdateDeviceSoundMode = async (ref: BluetoothAdrr | BLEDevice, m
}
};
-export const useUpdatePresetEqualizer = async (ref: BluetoothAdrr | BLEDevice, preset: EQProfile) => {
+export const useUpdatePresetEqualizer = async (
+ ref: BluetoothAdrr | BLEDevice,
+ preset: EQProfile
+) => {
if (window.isTauri && 'address' in ref) {
return useAsyncBridgeRequest({
command: 'setEqualizer',
@@ -39,7 +42,10 @@ export const useUpdatePresetEqualizer = async (ref: BluetoothAdrr | BLEDevice, p
* Set custom EQ values
* @param values The values should be in range -60..=60
*/
-export const useUpdateCustomEqualizer = async (ref: BluetoothAdrr | BLEDevice, values: number[]) => {
+export const useUpdateCustomEqualizer = async (
+ ref: BluetoothAdrr | BLEDevice,
+ values: number[]
+) => {
if (window.isTauri) {
return useAsyncBridgeRequest({
command: 'setEqualizer',
diff --git a/manager-ui/src/main.tsx b/manager-ui/src/main.tsx
index 32b91f3..969f9e2 100644
--- a/manager-ui/src/main.tsx
+++ b/manager-ui/src/main.tsx
@@ -30,10 +30,9 @@ const queryClient = new QueryClient({
}
});
-
if (window.isTauri) {
// Tauri-specific setup
- let _ = attachConsole();
+ const _ = attachConsole();
(async () => {
const logDir = await appLogDir();
console.log(
@@ -42,7 +41,6 @@ if (window.isTauri) {
})();
}
-
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
diff --git a/manager-ui/src/screens/bluetoothSearch.tsx b/manager-ui/src/screens/bluetoothSearch.tsx
index dd35ab0..24d432c 100644
--- a/manager-ui/src/screens/bluetoothSearch.tsx
+++ b/manager-ui/src/screens/bluetoothSearch.tsx
@@ -80,8 +80,7 @@ export const BluetoothSearchScreen: React.FC = () => {
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
- }}
- >
+ }}>
{
justifyContent: 'center',
flexDirection: 'column',
gap: '0.5rem'
- }}
- >
+ }}>
Connecting...
@@ -113,8 +111,7 @@ export const BluetoothSearchScreen: React.FC = () => {
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
- }}
- >
+ }}>
{
justifyContent: 'center',
flexDirection: 'column',
gap: '0.5rem'
- }}
- >
+ }}>
Select a connected device...
{isScanLoading && }
{!isScanLoading && }
@@ -138,8 +134,7 @@ export const BluetoothSearchScreen: React.FC = () => {
color="primary"
aria-label="add"
disabled={!selectedDevice || isConnecting}
- sx={{ position: 'absolute', bottom: 16, right: 16 }}
- >
+ sx={{ position: 'absolute', bottom: 16, right: 16 }}>
Connect
@@ -150,8 +145,7 @@ export const BluetoothSearchScreen: React.FC = () => {
color="primary"
aria-label="add"
disabled={isScanLoading}
- sx={{ position: 'absolute', bottom: 16, left: 16 }}
- >
+ sx={{ position: 'absolute', bottom: 16, left: 16 }}>
Refresh List
diff --git a/manager-ui/src/stores/web/useWebManagerStore.tsx b/manager-ui/src/stores/web/useWebManagerStore.tsx
index e965f50..d5c5289 100644
--- a/manager-ui/src/stores/web/useWebManagerStore.tsx
+++ b/manager-ui/src/stores/web/useWebManagerStore.tsx
@@ -14,4 +14,4 @@ export const useWebManagerStore = create((set) => ({
currentState: null,
setDevice: (device) => set({ device }),
setCurrentState: (currentState) => set({ currentState })
-}));
\ No newline at end of file
+}));