benwinding / react-admin-import-csv

A csv file import button for react-admin

Home Page:https://benwinding.github.io/react-admin-import-csv

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Create, Import, Export and Filter

sic4change opened this issue · comments

Hi,
Congratulations on your work!!

In my code I have:

const ListActions = props => {
  const { 
    className, 
    basePath, 
    total, 
    resource, 
    currentSort, 
    filterValues, 
    exporter 
  } = props;
  return (
    <TopToolbar className={className}>
      <CreateButton basePath={basePath} />
      <ExportButton
        disabled={total === 0}
        resource={resource}
        sort={currentSort}
        filter={filterValues}
        exporter={exporter}
      />
      <ImportButton {...props} />
    </TopToolbar>
  );
};

const UserFilter = (props) => (
  <Filter {...props}>
    <TextInput label="Search by name" source="name" alwaysOn />
    <ReferenceInput label="Country" source="country" reference="countries" allowEmpty>
      <SelectInput optionText="country" />
    </ReferenceInput>
    <ReferenceInput label="Community" source="community" reference="communities" allowEmpty>
      <SelectInput optionText="community" />
    </ReferenceInput>
  </Filter>
);

export const UserList = (props) => (
  <List {...props} filter={{ createdby: currentUser()}} filters={<UserFilter />} filterDefaultValues={{ createdby: currentUser()}} actions={<ListActions/>}>
    <Datagrid>
      <TextField source="name" />
      <TextField source="username" />
      <TextField source="sex" />
      <ImageField source="avatar.src" title="avatar" />
      <ReferenceField source="country" reference="countries" allowEmpty>
        <TextField source="country" />
      </ReferenceField>
      <ReferenceField source="community" reference="communities" allowEmpty>
        <TextField source="community" />
      </ReferenceField>
      <DateField source="birhtday" elStyle={{ color: 'red' }} />
      <TextField source="phone" />
      <EmailField source="email" />
      <UrlField source="web" />
      <BooleanField source="isAdmin" />
      <ShowButton label="" />
      <EditButton label="" />
      <DeleteButton label="" redirect={false}/>
    </Datagrid>
  </List>
);

But, I can not see my Filter button....

Can you help me, please. Regards

Thanks Mate!

Yeah when you use a custom actions panel, I think you need to add the filters component back in a again.

Try adding the <UseFilters {...props} /> to the actions element. Also see this example for more information:

https://marmelab.com/react-admin/List.html#actions

Cheers,
Ben