From b6a91adf78c939a832b53eb095a0168df46c3dab Mon Sep 17 00:00:00 2001 From: Eric Rosenbaum Date: Wed, 9 Jun 2021 17:38:22 -0400 Subject: [PATCH] add empty states and done button --- src/views/studio/l10n.json | 5 ++ .../studio/modals/user-projects-modal.jsx | 72 +++++++++++++------ .../studio/modals/user-projects-modal.scss | 11 ++- static/svgs/studio/add-to-studio-empty.svg | 46 ++++++++++++ 4 files changed, 110 insertions(+), 24 deletions(-) create mode 100644 static/svgs/studio/add-to-studio-empty.svg diff --git a/src/views/studio/l10n.json b/src/views/studio/l10n.json index da065babd..6c1b8c49f 100644 --- a/src/views/studio/l10n.json +++ b/src/views/studio/l10n.json @@ -23,6 +23,11 @@ "studio.openToAll": "Anyone can add projects", + "studio.addProjects.noSharedYet": "You don’t have shared projects that you can add to this studio yet.", + "studio.addProjects.noFavoritedYet": "You don’t have favorite projects that you can add to this studio yet.", + "studio.addProjects.noRecentYet": "You don’t have recently viewed projects that you can add to this studio yet.", + "studio.addProjects.noStudentsYet": "You don’t have student projects that you can add to this studio yet.", + "studio.projectsEmptyCanAdd1": "Your studio is looking a little empty.", "studio.projectsEmptyCanAdd2": "Add your first project!", "studio.projectsEmpty1": "This studio has no projects yet.", diff --git a/src/views/studio/modals/user-projects-modal.jsx b/src/views/studio/modals/user-projects-modal.jsx index 631bab5be..b599d98e0 100644 --- a/src/views/studio/modals/user-projects-modal.jsx +++ b/src/views/studio/modals/user-projects-modal.jsx @@ -77,33 +77,61 @@ const UserProjectsModal = ({ {error &&
Error loading {filter}: {error}
} -
- {items.map(project => ( - 0 ? ( + +
+ {items.map(project => ( + + ))} +
+ {moreToLoad && +
+ +
+ } +
+ ) : +
+ - ))} -
- {moreToLoad && -
- +
+ {filter === Filters.SHARED && + } + {filter === Filters.FAVORITED && + } + {filter === Filters.RECENT && + } + {filter === Filters.STUDENTS && + } +
} +
+ +
); }; diff --git a/src/views/studio/modals/user-projects-modal.scss b/src/views/studio/modals/user-projects-modal.scss index 87c70a7a5..ad46b2f86 100644 --- a/src/views/studio/modals/user-projects-modal.scss +++ b/src/views/studio/modals/user-projects-modal.scss @@ -22,19 +22,26 @@ .user-projects-modal-content { padding: 0 30px 30px; background: #E9F1FC; - max-height: calc(100vh - 200px); + min-height: 300px; + max-height: calc(100vh - 270px); overflow-y: auto; overscroll-behavior: contain; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; @media #{$intermediate-and-smaller} { - & { max-height: calc(100vh - 105px); } + & { max-height: calc(100vh - 175px); } } } .studio-projects-load-more { display: contents; } + + .studio-projects-done-row { + display: flex; + justify-content: flex-end; + padding: 6px 12px; + } } .studio-tile-added { diff --git a/static/svgs/studio/add-to-studio-empty.svg b/static/svgs/studio/add-to-studio-empty.svg new file mode 100644 index 000000000..82cc73823 --- /dev/null +++ b/static/svgs/studio/add-to-studio-empty.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +