Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ResponsiveDataTable bug and readme updates #635

Open
dottharun opened this issue Jun 2, 2024 · 2 comments
Open

ResponsiveDataTable bug and readme updates #635

dottharun opened this issue Jun 2, 2024 · 2 comments
Labels
kind/bug Something isn't working

Comments

@dottharun
Copy link
Contributor

Current Behavior

  • This minimal example, does'nt render the table and columns prop is ignored.
import { ResponsiveDataTable } from "@layer5/sistent";

function App() {
  const columns = [
    { name: "name", label: "Name" },
    { name: "company", label: "Company" },
    { name: "city", label: "City" },
    { name: "state", label: "State" },
  ];

  const data = [
    ["Joe James", "Test Corp", "Yonkers", "NY"],
    ["John Walsh", "Test Corp", "Hartford", "CT"],
    ["Bob Herm", "Test Corp", "Tampa", "FL"],
    ["James Houston", "Test Corp", "Dallas", "TX"],
  ];

  const colVis = { name: true, company: false, city: true, state: true };

  return (
    <>
      <ResponsiveDataTable
        data={data}
        columns={columns}
        columnVisibility={colVis}
      />
    </>
  );
}

export default App;

image

  • From the implementation tableCols prop seems to be required to render the Table.
  • Even with tableCols prop, columnVisibility seems to be ignored.
import { ResponsiveDataTable } from "@layer5/sistent";

function App() {
  const columns = [
    { name: "name", label: "Name" },
    { name: "company", label: "Company" },
    { name: "city", label: "City" },
    { name: "state", label: "State" },
  ];

  const data = [
    ["Joe James", "Test Corp", "Yonkers", "NY"],
    ["John Walsh", "Test Corp", "Hartford", "CT"],
    ["Bob Herm", "Test Corp", "Tampa", "FL"],
    ["James Houston", "Test Corp", "Dallas", "TX"],
  ];

  const colVis = { name: true, company: false, city: true, state: true };

  return (
    <>
      <ResponsiveDataTable
        data={data}
        tableCols={columns}  //should be optional
        columns={columns}
        columnVisibility={colVis}
      />
    </>
  );
}

export default App;

image

Expected Behavior

  • For each of these parameters - columns, tableCols, columnVisibility, Correct the implementation/readme to reflect correct behaviour.

Screenshots/Logs

Environment

  • Host OS: Mac Linux Windows
  • Platform: Docker or Kubernetes
  • Meshery Server Version: stable-v
  • Meshery Client Version: stable-v

Contributor Guides and Resources

@dottharun dottharun added the kind/bug Something isn't working label Jun 2, 2024
@MrPhenomenal3110
Copy link

Hii ! I would like to work on this !

@kamnajain06
Copy link

@dottharun Can I work on this if it is not assigned to @MrPhenomenal3110 ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind/bug Something isn't working
Development

No branches or pull requests

3 participants