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

Voila viewer #2163

Merged
merged 41 commits into from
May 22, 2021
Merged

Voila viewer #2163

merged 41 commits into from
May 22, 2021

Conversation

fiskus
Copy link
Member

@fiskus fiskus commented Apr 12, 2021

Description

  • Roughly added "view mode" to file viewer. Current view modes are: "Jupyter", "Voila" and "Json".
  • Added JSON and Voila viewers
  • Added SelectDropdown - a mix of Select and Button

TODO

  • Unit tests
  • Automated tests (e.g. Preflight)
  • Documentation
    • Python: Run build.py for new docstrings
    • JavaScript: basic explanation and screenshot of new features
  • Changelog entry

@codecov
Copy link

codecov bot commented Apr 12, 2021

Codecov Report

Merging #2163 (89563d7) into master (2bac447) will decrease coverage by 0.30%.
The diff coverage is 0.00%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #2163      +/-   ##
==========================================
- Coverage   46.31%   46.00%   -0.31%     
==========================================
  Files         446      450       +4     
  Lines       22179    22328     +149     
  Branches     2682     2707      +25     
==========================================
  Hits        10272    10272              
- Misses      11001    11145     +144     
- Partials      906      911       +5     
Flag Coverage Δ
api-python 89.85% <ø> (ø)
catalog 15.32% <0.00%> (-0.18%) ⬇️
lambda 94.00% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
catalog/app/components/Preview/loaders/Notebook.js 0.00% <0.00%> (ø)
...g/app/components/SelectDropdown/SelectDropdown.tsx 0.00% <0.00%> (ø)
catalog/app/components/SelectDropdown/index.ts 0.00% <0.00%> (ø)
catalog/app/constants/routes.js 0.00% <0.00%> (ø)
catalog/app/containers/Bucket/File.js 0.00% <0.00%> (ø)
catalog/app/containers/Bucket/FileView.js 0.00% <0.00%> (ø)
catalog/app/containers/Bucket/PackageTree.js 0.00% <0.00%> (ø)
catalog/app/containers/Bucket/viewModes.ts 0.00% <0.00%> (ø)
catalog/app/utils/global.ts 0.00% <0.00%> (ø)
... and 3 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 2bac447...89563d7. Read the comment docs.

@fiskus fiskus requested a review from nl0 April 22, 2021 09:05
Copy link
Member

@nl0 nl0 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good in general, some typos and nitpicking in the comments

catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/components/Preview/loaders/Notebook.js Outdated Show resolved Hide resolved
catalog/app/containers/Bucket/File.js Outdated Show resolved Hide resolved
const endpoint = Config.use().registryUrl
return React.useMemo(
() => `${endpoint}/voila/voila/render/${mkSearch({ url: sign(handle) })}`,
[endpoint, handle, sign],
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

with this approach we should make sure that handle object identity doesnt change, otherwise the url will be regenerated every time new handle object is created, even if its props are unchanged. we can either pass individual props to useMemo dependencies (like [handle.bucket, handle.key, ...) or use useMemoEq since it leverages deep equality checks

}))

interface ValueBase {
toString: () => string
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i meant maybe we dont need toString() and valueOf() methods here. what do we gain using that instead of plain { key, label } objects?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can use any items as long as they have toString and valueOf, for example, list of strings or numbers:

<SelectDropdown options={[ 'option1', 'option2' ]} value="option1" />
<SelectDropdown options={[ new Date('2020-01-01'), new Date('2020-01-02') ]} value={new Date('2020-01-01')}/>

@fiskus fiskus marked this pull request as ready for review May 21, 2021 14:47
This was referenced May 21, 2021
@fiskus fiskus merged commit 9656ee6 into master May 22, 2021
@fiskus fiskus deleted the voila-viewer branch May 22, 2021 08:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants