Add CSV Viewer to MessageFiles #42
Conversation
Added CSV Viewer to MessageFiles. Broke out the component as well to accomadate rendering various file types in the future. ** Note, need to add proper icons. ** Also, recommend adding table virtualization for full view of data to improve performance of large files.
✅ Deploy Preview for reachat-storybook ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
| }) => { | ||
| const { theme } = useContext(ChatContext); | ||
|
|
||
| const fileTypeRendererMap: { [key: string]: FC<any> } = { |
There was a problem hiding this comment.
This could probably be moved outside the function scope since its static.
| * @returns The sanitized cell content. | ||
| */ | ||
| const sanitizeCell = (cell: string): string => { | ||
| return cell.trim().replace(/^[=+\-@]/, ''); |
There was a problem hiding this comment.
we'll probably want to do a bit more here - i feel like simply stripping out the characters could be confusing
There was a problem hiding this comment.
Alternatively, apply the following sanitization to each field of the CSV, so that their content will be read as text by the spreadsheet editor:
- Wrap each cell field in double quotes
- Prepend each cell field with a single quote
- Escape every double quote using an additional double quote
possibly just these items w/ updated CSV example
| top: 0, | ||
| left: 0, | ||
| right: 0, | ||
| bottom: 0, |
There was a problem hiding this comment.
nit: maybe inset: 0 instead
| * Renderer for image files. | ||
| */ | ||
| const ImageFileRenderer: FC<ImageFileRendererProps> = ({ url }) => ( | ||
| <img src={url} alt="Image" className="h-10 w-10" /> |
There was a problem hiding this comment.
file org nit - i think i would keep this file separate from the rendered components. especially if we continue adding more renderers, this could get lost a bit
|
@nickhowell6425 thanks for the contribution! i just have some really minor nits + 1 comment around sanitization before i feel this is ready to get merged. but overall, this looks really good |
Added CSV Viewer to MessageFiles. Broke out the component as well to accomadate rendering various file types in the future.
** Note, need to add proper icons.
** Also, recommend adding table virtualization for full view of data to improve performance of large files.
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
What is the current behavior?
Issue Number: #38
What is the new behavior?
Added CSV Viewer to MessageFiles. Broke out the component as well to accomadate rendering various file types in the future.
Does this PR introduce a breaking change?
Other information