I have this mini-project. It is composed of 2 files in the same folder.

1. App.css

.App-align-left {
    text-align: left;
}

2. App.js

import React from 'react';
import 'App.css';

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: ''
        }
    }

    render() {
        let contents = <h4>Contents</h4>;
        return (
            <div style={{ display: "inline-block" }}><br />
                <h3 style={{ display: "inline-block" }}>Header</h3>
                <div className="App-align-left">{contents}</div><br />
            </div>)
    }
}

export default App;

When I run code inspection on this, it gives me a warning for App being unused (unused global export), but also for Selector App-align-left is never used. Why is this? It is clearly used.