I must refresh the data


This is my app/data/page.tsx
Data is not being updated

import { NextPage } from "next";
import { IEisItem, IProduct } from "../../interface";
import DataPage from "../../components/DataPage";

const fetchData = async () => {
    const res = await fetch('http://localhost:3001/api/eis/products', {
        method: 'GET',
        cache: 'no-store',
    })
    return res.json()
}

const Data: NextPage = async () => {
    const data: Array<IProduct> = await fetchData()

    const transformedData: Array<IEisItem> = ...
    return (
        <DataPage transformedData={transformedData} />
    )
}
export default Data

This is my component app/components/DataPage.tsx

"use client"
import { useState } from "react"
import { IEisItem } from "../../interface"
import DataTable from "./table"
import axios from "axios"
import { toast } from 'react-toastify'
import { revalidatePath, revalidateTag } from "next/cache"
import { useRouter } from 'next/navigation'
type props = {
    transformedData: Array<IEisItem>
}
const DataPage: React.FC<props> = ({ transformedData }) => {
..
    const handleScan = () => {
        setScanning(true)

        const scanPromise = axios.get('http://localhost:3001/api/eis/scan').then(() => {
            setScanning(false)
            // revalidateTag('products')
            revalidatePath('/data')
        }).catch((err) => console.log(err))


    }

    return (
        <section className="relative">
            <div className="w-full flex justify-between items-center mb-3">
                <h1>Products</h1>
            </div>
            <div className="w-full h-full overflow-hidden pb-[3rem]">
                <DataTable products={transformedData} />
            </div>

        </section>
    )
}
export default DataPage

NEXTJS 13.4 APP ROUTER