how to start with some data and then apply a filter to show complete data

Question

im stack all day with tryin to hide a row with a value from the status column with 'D' as a string with no luck, i tried all online but nothing worked with tanstack table library functions. Im even trying to gett a second working endpoint from my api in order to see if i can get a work around but no luck, someone have an idea?

i triedi everything but react tanstack table does not provide with ton of information and solution it self

im passying the data from my component page.tsx

"use client"

import * as React from "react";

import { columns } from "./_inventory-table/columns";
import { Suspense } from "react";

import { DataTableInventory } from "./_inventory-table/data-table";
import { DataNotFetchedScreen } from "@/components/custom/data-notshow"

import { fetchCleanInventoryData, fetchFullInventoryData } from "@/lib/data/inventory-data";
import Loader from "./loading";
import useSWR from "swr";

function InventoryPage() {
  const { data: parsedCleanInventory, error } = useSWR('clean-inv-data', fetchCleanInventoryData);
  const { data: parsedFullInventory } = useSWR('clean-inv-data', fetchFullInventoryData);

  if (error) {
    console.error("Error fetching data:", error);
    return <DataNotFetchedScreen error={error} />;
  }

  return (
    <Suspense fallback={<Loader />}>
      <DataTableInventory 
        data={parsedCleanInventory || []} 
        fullData={parsedFullInventory || []} 
        columns={columns} 
      />
    </Suspense>
  );
}

export default InventoryPage;

the the problem is with the table data-table.tsx

"use client"

import * as React from "react"
import {
  ColumnDef,
  ColumnFiltersState,
  SortingState,
  VisibilityState,
  flexRender,
  getCoreRowModel,
  getFacetedRowModel,
  getFacetedUniqueValues,
  getFilteredRowModel,
  getPaginationRowModel,
  getSortedRowModel,
  useReactTable,
} from "@tanstack/react-table"

import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table"

import { DataTablePagination } from "./pagination"
import { DataTableToolbar } from "./toolbar"

interface DataTableProps<TData, TValue> {
  columns: ColumnDef<TData, TValue>[]
  data: TData[]
  fullData: TData[]
}

export function DataTableInventory<TData, TValue>({
  columns,
  data,
  fullData
}: DataTableProps<TData, TValue>) {
  const [rowSelection, setRowSelection] = React.useState({})
  const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({})
  const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([])
  const [sorting, setSorting] = React.useState<SortingState>([])
  const [globalFilter, setGlobalFilter] = React.useState("");



  const table = useReactTable({
    data,
    columns,
    initialState: {
      pagination: {
        pageSize: 20,
      }
    },
    state: {
      sorting,
      columnVisibility,
      rowSelection,
      globalFilter,
      columnFilters,
    },
    debugRows: false,
    enableRowSelection: false,
    onRowSelectionChange: setRowSelection,
    onSortingChange: setSorting,
    columnResizeMode: "onChange", // TO DO RESIZE
    onColumnFiltersChange: setColumnFilters,
    onColumnVisibilityChange: setColumnVisibility,
    onGlobalFilterChange: setGlobalFilter,
    getCoreRowModel: getCoreRowModel(),
    getFilteredRowModel: getFilteredRowModel(),
    getPaginationRowModel: getPaginationRowModel(),
    getSortedRowModel: getSortedRowModel(),
    getFacetedRowModel: getFacetedRowModel(),
    getFacetedUniqueValues: getFacetedUniqueValues(),
  })

  return (
    <div className="space-y-4">
      <DataTableToolbar table={table} />
      <button onClick={() => setShowAllItems(!showAllItems)}>
        Toggle
      </button>
      <div className="rounded-md border overflow-hidden">
        <Table>
          <TableHeader>
            {table.getHeaderGroups().map((headerGroup) => (
              <TableRow key={headerGroup.id} className="hover:bg-muted/0 data-[state=selected]:bg-muted">
                {headerGroup.headers.map((header) => {
                  return (
                    <TableHead key={header.id} colSpan={header.colSpan} className="text-white">
                      {header.isPlaceholder
                        ? null
                        : flexRender(
                          header.column.columnDef.header,
                          header.getContext()
                        )}
                      {/* <div 
                          onMouseDown={header.getResizeHandler()} 
                          onTouchStart={header.getResizeHandler()}
                        >
                        </div> */}
                    </TableHead>
                  )
                })}
              </TableRow>
            ))}
          </TableHeader>
          <TableBody>
            {table.getRowModel().rows?.length ? (
              table.getRowModel().rows
                .map((row) => (
                  <TableRow
                    key={row.id}
                    data-state={row.getIsSelected() && "selected"}
                  >
                    {row.getVisibleCells().map((cell) => (
                      <TableCell key={cell.id} className="py-[0.3rem] px-0">
                        {flexRender(
                          cell.column.columnDef.cell,
                          cell.getContext()
                        )}
                      </TableCell>
                    ))}
                  </TableRow>

                ))
            ) : (
              <TableRow>
                <TableCell
                  colSpan={columns.length}
                  className="h-18 text-center"
                >
                  Nessun risultato!
                </TableCell>
              </TableRow>
            )}
          </TableBody>
        </Table>
      </div>
      <DataTablePagination table={table} />
    </div>
  )
}

i treid editing the filters passing a new table in order to filter righ. What im expencting is to return as initalState that the data showing is only status column id with values 'A' and 'N', no 'D' allowed, but when im toggling a button, i will see the full data by default (for future user handling purposes) and then my filters, but the problem is still the intialState of the table im starting with