Invalid Hook Call but not really

I am creating an app with a FAQ page and ran into this problem while struggling to install semantic-ui on my app. I know, dumb. This was working completely fine before I experimented with some npm installs and updates and what not. I've tried reinstalling nodejs, starting a new react project and copy pasting all the code back, reverting my commits, all to no avail. I am using Visual Studio 2019 and created an ASP.NET Core Web Application C# Reactjs project btw.

The error message:

This is the error message: Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

I don't really know what the problem is here. I'm getting an invalid hook call error, but I have checked.

1. I have the same version of React and React DOM (17.0.1)

2. I have not broken any Rules of Hooks. This is my hook:

   function FAQdata({ faq }) {
   const [open, setOpen] = useState(false);
   
   return (
       <div className="faq"> 
           <a onClick={() => setOpen(!open)} aria-controls={faq.id} aria-expanded={open} type="button">
               <div className="sporsmaal">
                   {faq.sporsmaal}
               </div>
           </a>
           <Collapse in={open}>
           <div className="svar" id={faq.id}>
               {faq.svar}
               </div>
           </Collapse>
       </div>
       );
   }
   

3. I have only one React in the same app:

npm ls react
thisuser@ C:\Users\thisuser
`-- react-bootstrap@1.4.0
  +-- @restart/context@2.1.4
  | `-- react@17.0.1 deduped
  +-- @restart/hooks@0.3.25
  | `-- react@17.0.1 deduped invalid
  +-- prop-types-extra@1.1.1
  | `-- react@17.0.1 deduped
  +-- react-dom@17.0.1
  | `-- react@17.0.1 deduped
  +-- react-overlays@4.1.1
  | `-- react@17.0.1 deduped
  +-- react-transition-group@4.4.1
  | `-- react@17.0.1 deduped
  +-- react@17.0.1
  `-- uncontrollable@7.1.1
    `-- react@17.0.1 deduped

Upon using npm ls react I get this error tho:

npm : npm ERR! code ELSPROBLEMS

and

npm ERR! invalid: react@17.0.1 C:\Users\thisuser\node_modules\react

The snippet of code that is displayed in the error message is this:

//Faq is a controller 'FaqController.cs'
//HentAlle is a method in the controller which gets information from a database
 axios.get('Faq/HentAlle')
            .then(res => {
                const faqs = res.data;
                this.setState({ faqs });
            })

This is FAQ.js

import React, { Component, useState } from 'react';
import axios from 'axios';
import Collapse from 'react-bootstrap/Collapse';
import Button from 'react-bootstrap/Button';


export class FAQ extends Component {
    static displayName = FAQ.name;

    constructor(props) { 
        super(props);

        this.state = {
            faqs: [], 
            //setFaqs: []
        };
    }

    componentDidMount() {
        axios.get('Faq/HentAlle')
            .then(res => {
                const faqs = res.data;
                this.setState({ faqs });
            })
    }

    render() { 
        const faqItem = this.state.faqs.map((faq) =>
            <dl key={faq.id}>
                <FAQdata faq={faq} />
            </dl>
        );

        
        return (
            <div className="faqs">
                {faqItem}
            </div>
        );
    }
}    

function FAQdata({ faq }) {
    const [open, setOpen] = useState(false);

    return (
        <div className="faq"> 
            <a onClick={() => setOpen(!open)} aria-controls={faq.id} aria-expanded={open} type="button">
                <div className="sporsmaal">
                    {faq.sporsmaal}
                </div>
            </a>
            <Collapse in={open}>
            <div className="svar" id={faq.id}>
                {faq.svar}
                </div>
            </Collapse>
        </div>
        );
}

I really have no idea how to solve this as I keep getting errors every time I run something in the Package Manager Console or otherwise.