I am trying to Export the State property “currentValue” from “Flowmeter.jsx” and import it to “databaseValue.js”. But i get error not defined

import React, { Component,} from 'react';
import App from '../App';

// this is my Component Flowmeter that has 2 buttons for incrementing and decrementing the
// the value of the state property currentValue


class Flowmeter extends Component {
 // 
    state = {
        values: [],
        currentValue: 0,
        number: 1,
        myNumbers: [1000, 2000, 3000],    
    };    
      // checking if my code otherwise works with the "myNumbers" property
    componentDidMount(){
        this.setState({ values: this.state.myNumbers });
    }
    // Button for incrementing "currentValue" by 1
    handleNextValue = () => {
        console.log('handleNextValue clicked');
        if(this.state.currentValue === this.state.values.length) return;
        this.setState({currentValue : this.state.currentValue +1 });
    };
    //Button for decrementing "currentValue" by 1
    handlePreviousValue = () => { 
        if(this.state.currentValue === 0) return;
        console.log('handlepreviousValue clicked');
        this.setState({currentValue : this.state.currentValue -1 });    
    }; 

    render()
    {
      //rendering my increment and decrement buttons
        return (
            <div>   
            <button onClick={this.handleNextValue}> next </button>
            <button onClick={this.handlePreviousValue}> previous </button>
            </div>
        )
    }
};
// trying to export currentValue.
// i have tried to set the export to {this.state.currentValue }; but nothing seems to work
export { currentValue };
export default Flowmeter;

this is the code for “Flowmeter.jsx”

i get this error when i try to export currentValue,

srccomponentsFlowMeter.jsx
Line 46:9: Parsing error: Export ‘currentValue’ is not defined. (46:9)

 // in this Function i fetch data from a firebase backend and store it in dbValues
import { database } from "./firebaseConfig";
import { collection, getDocs } from "firebase/firestore";
import React, { Component, useState, useEffect } from 'react';
import Flowmeter from './components/FlowMeter';
import { currentValue } from './components/FlowMeter';

  function databaseValue (){
    const [dbValues, setValues] = useState([]);
    const valuesCollection = collection(database, "Values");
   
    useEffect(() => {
      const getValues = async () => {
        const data = await getDocs(valuesCollection);
        console.log(data);
        console.log('testing...');
        setValues(data.docs.map((doc) => ({...doc.data()})));
      };
      getValues();
    }, []);

here i am trying to render the dbValues 1 by 1 with the help of an index of “currentValue”

    return ( <div className="Backend">
    {dbValues.map((Value) => {
     return <div> <h1>{Value.arrayValue[currentValue]}</h1> </div>;
    })}
    </div>
    );
}

export default databaseValue;

this is the code for “databasevalue.js”