FlatFilers / Adapter

A simple adapter for elegantly importing CSV files via flatfile.io

Home Page:https://flatfilers.github.io/Adapter

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Ability to define fields programmatically

ramon-villain opened this issue · comments

  • I'm submitting a ...
    [ ] bug report
    [x] feature request
    [ ] question about the decisions made in the repository
    [x] question about how to use this project

  • Summary

Hello, we are integrating FlatFile in our application but we have a specific requirement, our schema/field is based in a user selection, I'd like to know if there's any plan to support an api that allows us to provide the fields programmatically so that we don't need to destroy and mount a new FF instance every time the user changes the schema.

https://www.loom.com/share/e73fb0deccea4f798d77b16d2624eee2

  • Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. StackOverflow, personal fork, etc.)
const Component = () => {
  const imp = useRef<FlatfileImporter | null>(null);
  const [selectedFormat, setSelectedFormat] = useState<string>('');

  useEffect(() => {
    if (selectedFormat) {
      imp.current = new FlatFile('key', { ...opts, fields: schemas[selectedSchema] });
      imp.current.setCustomer({
        userId: userId || '',
        companyId: account ? account.id : '',
        companyName: account ? account.name : '',
        email: user ? user.traits.email : '',
        name: user ? `${user.traits.firstName} ${user.traits.lastName}` : '',
      });

      imp.current
        .requestDataFromUser()
        .then((results) => {
          console.log(results);
        })
        .catch(function (error) {
          console.error(error);
        });
    }
  }, [selectedFormat]);

  return (
    <>
      <button onClick={() => setSelectedFormat('schema1')}>Schema 1</button>
      <button onClick={() => setSelectedFormat('schema2')}>Schema 2</button>
    </>
  );
};

@ramon-villain Hi! Try using our @flatfile/react adapter, which will allow you to add as many FlatfileButton components as you want.

NPM: https://www.npmjs.com/package/@flatfile/react
CodeSandbox Link: https://codesandbox.io/s/multiple-flatfilebutton-l2fwl