reimagined / resolve

Full stack CQRS, DDD, Event Sourcing framework for Node.js

Home Page:https://reimagined.github.io/resolve/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Image upload example is too complicated

alexslavr opened this issue · comments

The image upload example is too complicated.

All state in the single hook is not readable:
https://github.com/reimagined/resolve/blob/dev/examples/ts/personal-data/client/components/ImageUpload.tsx#L27
React docs about splitting state variables:
https://reactjs.org/docs/hooks-faq.html#should-i-use-one-or-many-state-variables

What is the difference between token and staticToken ?
https://github.com/reimagined/resolve/blob/dev/examples/ts/personal-data/client/components/ImageUpload.tsx#L58
https://github.com/reimagined/resolve/blob/dev/examples/ts/personal-data/client/components/ImageUpload.tsx#L96

The cdnUrl available also in ResolveContext, uploader context is redundant:
https://github.com/reimagined/resolve/blob/dev/examples/ts/personal-data/client/components/ImageUpload.tsx#L55
Related issue:
#2150

It will be better to split ImageUploader react component into something like:

Parent component:

// hooks and upload logic
<ImageUploader /> - 

Upload renderer:
https://github.com/reimagined/resolve/blob/dev/examples/ts/personal-data/client/components/ImageUpload.tsx#L115

<UploadForm  fields={form.fields} onSubmitHandler={onSubmitHandler}  />

Maybe other forms:

...
 <OtherForms defaultValue={cdnUrl} onClick={handleGetUrl}  /> 
...