Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

94
Views
Electron+React useState doesn't update when window is minimized

I am using Electron + React trying to set up a stopwatch timer that updates the price value by certain amount every second using useState hook . the component works fine when the window is open . The problem is when the window is minimized the counter freezes and when i open the window back up it resumes. here's the code for the component:

import React, { useState } from "react";
import BtnComponent from './BtnComponent';
import DisplayComponent from './DisplayComponent';
import "../index.css";

function Timer(props) { 
 


  const [price, setPrice] = useState(0);
  const [time, setTime] = useState({ ms: 0, s: 0, m: 0, h: 0 });
  const [interv, setInterv] = useState();
  const [status, setStatus] = useState(0);
  const start = () => {
    run();
    setStatus(1);
    setInterv(setInterval(run, 10));
  };

  var updatedMs = time.ms,
    updatedS = time.s,
    updatedM = time.m,
    updatedH = time.h,
    updatedP = price;

  const run = () => {
    if (updatedM === 60) {
      updatedH++;
      updatedM = 0;
    }
    if (updatedS === 60) {
      updatedM++;
      updatedS = 0;
    }
    if (updatedMs === 100) {
      updatedS++;
      updatedMs = 0;
      updatedP = updatedP + ((220 / 60)/60);
    }
    updatedMs++;
     
    
    return (
      setTime({ ms: updatedMs, s: updatedS, m: updatedM, h: updatedH }),
      setPrice(parseInt(updatedP)));
  };


  const stop = () => {
    clearInterval(interv);
    setStatus(2);

  };

  const reset = () => {
    clearInterval(interv);
    setStatus(0);
    setTime({ ms: 0, s: 0, m: 0, h: 0 });
    setPrice(0);
  };

  const resume = () => start();


  return (
    <div className="clock-holder">
      <div className="stopwatch">
        <DisplayComponent
          time={time}
          price={price}
          posteid={props.post}
          img={props.img}
          color={props.color}
        />
        <BtnComponent
          status={status}
          resume={resume}
          reset={reset}
          stop={stop}
          start={start}
        />
      </div>
    </div>
  );
}

export default Timer

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!