Time Tracking Dashboard w/ React(react-create-app), json-server & Sass

Hi there, thanks for visiting my solution page. This is my 2nd React challenge at FEM, it was tough using React rather than using only HTML and vanilla JavaScript...! I used custom hooks introduced in NetNinja tutorial and used context object. I may have been thinking in a overcomplicated way, so I'd like to know if there's any simpler solutions for this challenge. I have the following issues / questions that came up;

1. Accessibility

• In FrequencySelector.js file, I have three buttons (Daily, Weekly, and Monthly). I am not sure that I should use "aria-expanded" and "aria-controls" for this situation, as there are no expandable/collapsing elements. The button is kind of switches. I put "aria-expanded" however I could not use "aria-controls" because I was not sure where to put "id". If I have switched entire cards by pressing buttons, I could use aria-controls?
• I used ternary operator to toggle aria-expanded, but is there better way for this? (e.g. using useState like; const [ariaExpanded, setAriaExpanded] = useState("false"))

This issue has been solved by help with @AlexKMarshall !!

2. React & json-server

• In TaskList.js, I had to pull nested data current and previous from data.json file through json-server. I wanted to do that dynamically, for example;

<span className="main__task-current">
        {`stat.timeframes.${frequency}.current}hrs
</span>

However, it didn't work. Is there any methods to make "frequency" dynamic?

• Should I map through <button> elements in FrequencySelctor.js? I could not figure out how, but I had feeling that I may have been able to.

There's so many questions but I hope someone can kindly help me.