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

✨(website) filter contents by playlist #2176

Merged
merged 6 commits into from
Apr 25, 2023

Conversation

AntoLC
Copy link
Contributor

@AntoLC AntoLC commented Apr 6, 2023

Purpose

Feature request: #2146

Add a filter on the content page, only playlist filter for the moment.

Proposal

  • integrate filter on contents
  • design
  • test
Marsha.-filter.webm

@AntoLC AntoLC self-assigned this Apr 6, 2023
@AntoLC AntoLC force-pushed the feature/anthony/website/resource-filter-playlist branch 3 times, most recently from 064ac86 to 9a0eccd Compare April 11, 2023 11:35
@AntoLC AntoLC linked an issue Apr 11, 2023 that may be closed by this pull request
@AntoLC AntoLC force-pushed the feature/anthony/website/resource-filter-playlist branch from 9a0eccd to 7358de7 Compare April 11, 2023 11:52
@AntoLC AntoLC marked this pull request as ready for review April 11, 2023 11:52
Copy link
Member

@kernicPanel kernicPanel left a comment

Choose a reason for hiding this comment

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

Nice work!
Just a suggestion concerning the filter UI, other than that, LGTM 👍

Comment on lines 133 to 143
pad={showFilter ? 'medium' : '0px'}
height={{ max: showFilter ? '300px' : '0px' }}
style={{
transform: showFilter ? 'scaleX(1)' : 'scaleX(0.2)',
opacity: showFilter ? '1' : '0',
transition: 'all 0.3s ease-in-out',
boxShadow: 'inset rgba(2, 117, 180, 0.3) 1px 1px 6px 0px',
Copy link
Member

Choose a reason for hiding this comment

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

IMHO, I prefer something like this, only vertical animation and no boxshadow, WDYT ?

Suggested change
pad={showFilter ? 'medium' : '0px'}
height={{ max: showFilter ? '300px' : '0px' }}
style={{
transform: showFilter ? 'scaleX(1)' : 'scaleX(0.2)',
opacity: showFilter ? '1' : '0',
transition: 'all 0.3s ease-in-out',
boxShadow: 'inset rgba(2, 117, 180, 0.3) 1px 1px 6px 0px',
pad="small"
height={{ max: showFilter ? '300px' : '0px' }}
style={{
transform: showFilter ? 'scaleY(1)' : 'scaleY(0)',
transformOrigin: 'top',
opacity: showFilter ? '1' : '0',
transition: 'all 0.3s ease-in-out',
boxShadow: 'none',
filters.mp4

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes vertical anim is nice as well.
For the pad line 33, I kept the same pad of the other white block, if you don't switch it to 0, the dom keep the padding height when it is not displayed.
Personally I like the boxShadow inset, give a bit of relief and help to distinguish from the content, but it is probably subjective.
Let's see what Manu say, but I am totally open for changes.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

From the daily, we agreed on the vertical anim and kept the boxShadow.

CHANGELOG.md Outdated
@@ -18,6 +18,7 @@ Versioning](https://semver.org/spec/v2.0.0.html).
- Add sentry
- Create a live from the website (#2134)
- Integrate webinar dashboard (#2135)
- filter contents by playlist (#2176)
Copy link
Member

Choose a reason for hiding this comment

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

Don't forget to move in the unreleased section this modification

Refactor the header of the Contents page to a dedicated component
in order to stay DRY between contents.
- Refactorise the way to get the data
- Better control of dropdown components
- Filter the contents by playlist.
- Add button filter
The homepage lists ressources, it uses the same component as the
resource page. Problem is, we don't want a filter on the homepage.
This commit makes the filter optional to not show the
filter on the homepage.
When a welcome message was too long, it breaked a bit the layout
of the classroom.
We now truncate the message to 1 line.
Show if a filtering is applied on the resource list. This is done by
showing a badge with the amount of filter applied.
@AntoLC AntoLC force-pushed the feature/anthony/website/resource-filter-playlist branch from 7358de7 to 399ba1a Compare April 25, 2023 09:35
@AntoLC AntoLC enabled auto-merge (rebase) April 25, 2023 09:39
@AntoLC AntoLC merged commit 92a15cc into master Apr 25, 2023
@AntoLC AntoLC deleted the feature/anthony/website/resource-filter-playlist branch April 25, 2023 09:48
lunika added a commit that referenced this pull request Apr 28, 2023
Added

- Standalone website:
  - Filter contents by playlist (#2176)
  - Add playlist contents on playlist page (#2182)
  - Add a button to create a playlist from any resource creation form
- Add a command to sync media channel states and video states
- pages model api for standalone footer TOS or some legal notices

Changed

- Standalone website:
  - Improve architecture Contents feature (#2183)
- Move edition icon on title input at the begining of the input
- Increase description textarea min height
- Marsha permission core split files

Removed

- start date under the title on the BBB dashboard

Fixed

- Standalone website:
  - Correctly display creation form when there is no playlist
lunika added a commit that referenced this pull request Apr 28, 2023
Added

- Standalone website:
  - Filter contents by playlist (#2176)
  - Add playlist contents on playlist page (#2182)
  - Add a button to create a playlist from any resource creation form
- Add a command to sync media channel states and video states
- pages model api for standalone footer TOS or some legal notices

Changed

- Standalone website:
  - Improve architecture Contents feature (#2183)
- Move edition icon on title input at the begining of the input
- Increase description textarea min height
- Marsha permission core split files

Removed

- start date under the title on the BBB dashboard

Fixed

- Standalone website:
  - Correctly display creation form when there is no playlist
lunika added a commit that referenced this pull request May 2, 2023
Added

- Standalone website:
  - Filter contents by playlist (#2176)
  - Add playlist contents on playlist page (#2182)
  - Add a button to create a playlist from any resource creation form
- Add a command to sync media channel states and video states
- pages model api for standalone footer TOS or some legal notices

Changed

- Standalone website:
  - Improve architecture Contents feature (#2183)
- Move edition icon on title input at the begining of the input
- Increase description textarea min height
- Marsha permission core split files

Removed

- start date under the title on the BBB dashboard

Fixed

- Standalone website:
  - Correctly display creation form when there is no playlist
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Filter resources by playlist on the standalone site
3 participants