Merge remote-tracking branch 'prod/main' into HEAD

package.json

@@ -28,6 +28,7 @@
         "react-i18next": "^15.0.1",
         "react-icons": "^5.3.0",
         "uuid": "^10.0.0",
+        "react-transition-group": "^4.4.5",
         "vite-tsconfig-paths": "^5.0.1",
         "zustand": "^4.5.5"
     },

public/locales/en/common.json

@@ -12,5 +12,6 @@
     "resources": "Resources",
     "hashrate": "Hashrate",
     "utilization": "Utilization",
-    "mode": "Mode"
+    "mode": "Mode",
+    "day": "Day"
 }

public/locales/en/mining-view.json

@@ -7,6 +7,7 @@
         "starting-mining": "Starting Mining",
         "start-mining": "Start Mining",
         "pause-mining": "Pause Mining",
+        "changing-mode": "Changing mode",
         "cancel-mining": "Cancel Mining",
         "waiting-for-idle": "Waiting for Idle",
         "started-auto-mining": "Auto Mining Started"

public/locales/pl/common.json

@@ -12,5 +12,6 @@
     "resources": "Zasoby",
     "hashrate": "Prędkość ( hashrate )",
     "utilization": "Wykorzystanie",
-    "mode": "Tryb"
+    "mode": "Tryb",
+    "day": "Dzień"
 }

public/locales/pl/mining-view.json

@@ -7,6 +7,7 @@
         "starting-mining": "Uruchamianie kopania",
         "start-mining": "Uruchom kopanie",
         "pause-mining": "Wstrzymaj kopanie",
+        "changing-mode": "Zmiana trybu",
         "cancel-mining": "Anuluj kopanie",
         "waiting-for-idle": "Oczekiwanie na bezczynność",
         "started-auto-mining": "Automatyczne kopanie uruchomione"

src-tauri/src/main.rs

@@ -62,21 +62,9 @@ mod setup_status_event;
 #[tauri::command]
 async fn set_mode<'r>(
     mode: String,
-    window: tauri::Window,
     state: tauri::State<'r, UniverseAppState>,
-    app: tauri::AppHandle,
 ) -> Result<(), String> {
-    match stop_mining(state.clone()).await {
-        Ok(_) => {
-            let _ = state.config.write().await.set_mode(mode).await;
-            match start_mining(window, state.clone(), app).await {
-                Ok(_) => {}
-                Err(e) => warn!(target: LOG_TARGET, "Failed to start mining: {}", e.to_string()),
-            };
-        }
-        Err(e) => warn!(target: LOG_TARGET, "Failed to stop mining: {}", e.to_string()),
-    };
-
+    let _ = state.config.write().await.set_mode(mode).await;
     Ok(())
 }
 

src/App.tsx

@@ -14,12 +14,14 @@ import { useSetUp } from './hooks/useSetUp.ts';
 import { useEnvironment } from './hooks/useEnvironment.ts';
 import { useAirdropTokensRefresh } from './hooks/airdrop/useAirdropTokensRefresh.ts';
 import { SplashScreen } from './containers/SplashScreen';
+import { useMiningEffects } from './hooks/mining/useMiningEffects.ts';
 
 function App() {
     useAirdropTokensRefresh();
     useSetUp();
     useGetStatus();
     useEnvironment();
+    useMiningEffects();
 
     const view = useUIStore((s) => s.view);
     const showSplash = useUIStore((s) => s.showSplash);

src/containers/SideBar/Miner/Miner.tsx

@@ -4,18 +4,20 @@ import AutoMiner from './components/AutoMiner/AutoMiner.tsx';
 
 import ModeSelect from './components/ModeSelect.tsx';
 import { useHardwareStatus } from '../../../hooks/useHardwareStatus.ts';
-import { Divider } from '@mui/material';
+import { Box, Divider, Fade, Slide, Stack } from '@mui/material';
 
 import { useCPUStatusStore } from '@app/store/useCPUStatusStore.ts';
 import { useMiningControls } from '@app/hooks/mining/useMiningControls.ts';
 import { formatNumber } from '@app/utils/formatNumber.ts';
+import { useRef } from 'react';
+import { TransitionGroup } from 'react-transition-group';
 import { useTranslation } from 'react-i18next';
 
 function Miner() {
     const { t } = useTranslation('common', { useSuspense: false });
 
     const { cpu: cpuHardwareStatus } = useHardwareStatus();
-    const { isWaitingForHashRate } = useMiningControls();
+    const { isWaitingForHashRate, isMiningEnabled, isChangingMode } = useMiningControls();
 
     const hash_rate = useCPUStatusStore((s) => s.hash_rate);
     const estimated_earnings = useCPUStatusStore((s) => s.estimated_earnings);
@@ -31,33 +33,55 @@ function Miner() {
         })
         .replace(/,/g, '.');
 
+    const containerRef = useRef<HTMLDivElement>(null);
+
     return (
         <MinerContainer>
-            <AutoMiner />
-            <Divider />
-            <TileContainer>
-                <Tile title={t('resources')} stats="CPU" />
-                <ModeSelect />
-                <Tile
-                    title={`${t('hashrate')} (H/s)`}
-                    stats={`${hashRateStr}${hashRateOver1k ? 'k' : ''}`}
-                    isLoading={isWaitingForHashRate}
-                />
-                <Tile
-                    title={`CPU ${t('utilization')}`}
-                    stats={
-                        (cpuHardwareStatus?.usage_percentage || 0).toLocaleString(undefined, {
-                            maximumFractionDigits: 0,
-                        }) + '%'
-                    }
-                />
-                <Tile title="CHIP/GPU" stats={hardwareVal || t('unknown')} />
-                <Tile
-                    title="Est tXTM/day"
-                    stats={formatNumber(estimated_earnings / 1000000)}
-                    isLoading={isWaitingForHashRate}
-                />
-            </TileContainer>
+            <TransitionGroup>
+                <AutoMiner />
+                <Divider sx={{ my: 2 }} />
+                <TileContainer>
+                    <ModeSelect />
+                    <Tile
+                        title={`${t('hashrate')} (H/s)`}
+                        stats={`${hashRateStr}${hashRateOver1k ? 'k' : ''}`}
+                        isLoading={isWaitingForHashRate}
+                    />
+                    <Tile title="CHIP/GPU" stats={hardwareVal || t('unknown')} />
+                    <Tile
+                        title={`Est tXTM/${t('day')}`}
+                        stats={formatNumber(estimated_earnings / 1000000)}
+                        isLoading={isWaitingForHashRate}
+                    />
+                </TileContainer>
+                <Stack ref={containerRef} my={0.6}>
+                    <Slide
+                        direction="up"
+                        in={isMiningEnabled || isChangingMode}
+                        container={containerRef.current}
+                        timeout={450}
+                    >
+                        <Box>
+                            <Fade in={isMiningEnabled || isChangingMode} timeout={450}>
+                                <TileContainer sx={{ zIndex: -199 }}>
+                                    <Tile
+                                        title={`CPU ${t('utilization')}`}
+                                        stats={
+                                            (cpuHardwareStatus?.usage_percentage || 0).toLocaleString(undefined, {
+                                                maximumFractionDigits: 0,
+                                            }) + '%'
+                                        }
+                                    />
+                                    <Tile
+                                        title={`CPU ${t('temperature')}`}
+                                        stats={`${cpuHardwareStatus?.current_temperature || 0}°C`}
+                                    />
+                                </TileContainer>
+                            </Fade>
+                        </Box>
+                    </Slide>
+                </Stack>
+            </TransitionGroup>
         </MinerContainer>
     );
 }

src/containers/SideBar/Miner/components/ModeSelect.tsx

@@ -8,6 +8,8 @@ import { Typography } from '@mui/material';
 import { TileItem } from '../styles';
 import { useAppStatusStore } from '@app/store/useAppStatusStore.ts';
 import { Theme, useTheme } from '@mui/material/styles';
+import { useMiningControls } from '@app/hooks/mining/useMiningControls';
+import { StyledIcon } from '@app/containers/Dashboard/MiningView/components/MiningButton.styles';
 import { useTranslation } from 'react-i18next';
 
 const CustomSelect = styled(Select)(({ theme }: { theme: Theme }) => ({
@@ -27,10 +29,10 @@ function ModeSelect() {
     const { t } = useTranslation('common', { useSuspense: false });
 
     const mode = useAppStatusStore((s) => s.mode);
-    const setConfigMode = useAppStatusStore((s) => s.setConfigMode);
+    const { changeMode, isChangingMode } = useMiningControls();
 
     const handleChange = (event: SelectChangeEvent<unknown>) => {
-        setConfigMode(event.target.value as modeType);
+        changeMode(event.target.value as modeType);
     };
     const theme = useTheme();
     return (
@@ -43,7 +45,8 @@ function ModeSelect() {
                     theme={theme}
                     value={mode}
                     onChange={handleChange}
-                    IconComponent={IoCode}
+                    disabled={isChangingMode}
+                    IconComponent={isChangingMode ? StyledIcon : IoCode}
                     sx={{
                         '& .MuiSelect-icon': {
                             transform: 'rotate(90deg)',

src/containers/SideBar/Miner/components/Tile.tsx

@@ -14,7 +14,7 @@ function Tile({ title, stats, isLoading }: TileProps) {
         <TileItem>
             <Typography variant="body2">{title}</Typography>
             {isLoading ? (
-                <StyledIcon sx={{ height: 24, width: 24 }} />
+                <StyledIcon sx={{ height: 20, width: 20 }} />
             ) : (
                 <Typography variant="h5" fontSize={18}>
                     {truncateString(stats, 10)}

src/containers/SideBar/Miner/styles.ts

@@ -21,6 +21,7 @@ export const TileItem = styled(Box)(({ theme }) => ({
     backgroundColor: theme.palette.background.paper,
     borderRadius: theme.shape.borderRadius,
     boxShadow: '0px 4px 45px 0px rgba(0, 0, 0, 0.08)',
+    maxWidth: '152px',
 }));
 
 export const ScheduleButton = styled(Button)(({ theme }) => ({