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

feat: Explorer panel design for multiple projects #532

Merged
merged 10 commits into from
Sep 11, 2023

Conversation

cguedes
Copy link
Collaborator

@cguedes cguedes commented Sep 11, 2023

This PR updated the UI to the latest design with menu triggers for the project and files.

image

image

@cguedes cguedes linked an issue Sep 11, 2023 that may be closed by this pull request
@cguedes cguedes requested a review from sehyod September 11, 2023 10:59
@codecov
Copy link

codecov bot commented Sep 11, 2023

Codecov Report

Merging #532 (beb822b) into main (39baccd) will increase coverage by 0.24%.
The diff coverage is 97.32%.

@@            Coverage Diff             @@
##             main     #532      +/-   ##
==========================================
+ Coverage   81.81%   82.06%   +0.24%     
==========================================
  Files         218      219       +1     
  Lines       12104    12242     +138     
  Branches     1197     1207      +10     
==========================================
+ Hits         9903    10046     +143     
+ Misses       2187     2182       -5     
  Partials       14       14              
Files Changed Coverage Δ
src/application/sidebar/ExplorerPanel.tsx 0.00% <0.00%> (ø)
src/application/sidebar/ProjectFileExplorer.tsx 100.00% <100.00%> (ø)
...orerContextMenu/FileExplorerProjectContextMenu.tsx 100.00% <100.00%> (ø)
...eExplorerContextMenu/useFileExplorerContextMenu.ts 87.50% <100.00%> (+8.33%) ⬆️
src/application/sidebar/icons.tsx 89.53% <100.00%> (+2.96%) ⬆️
src/wrappers/ContextMenus.tsx 100.00% <100.00%> (ø)

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

src/components/FileNameInput.tsx Outdated Show resolved Hide resolved
src/application/sidebar/FileExplorer.tsx Outdated Show resolved Hide resolved
src/application/sidebar/FileExplorer.tsx Outdated Show resolved Hide resolved
import { ArrowDownIcon, HorizontalDotsIcon } from './icons';

export function FileExplorer({ projectName }: { projectName: string }) {
const [collapsed, setCollapsed] = useState(false);
Copy link
Collaborator

@sehyod sehyod Sep 11, 2023

Choose a reason for hiding this comment

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

This is stored in an atom for projects folders, so that when you close and re-open the explorer, everything keeps its state. I think it would be great to also save that in an atom for the projects.
I think we should create an atom openProjectState with some useful values like name, id and isCollapsed. When we update the app so support multiple projects, we can then update the atom to be a list of ProjectStates

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I see your idea, but I think we should implement that later once we really support having multiple projects open at the same time. For now we are only making sure we have the design ready.

@cguedes cguedes changed the title ƒeat: Explorer panel design for multiple projects feat: Explorer panel design for multiple projects Sep 11, 2023
@cguedes cguedes requested a review from sehyod September 11, 2023 12:46
@cguedes cguedes marked this pull request as ready for review September 11, 2023 12:46
@cguedes cguedes merged commit ee9f56c into main Sep 11, 2023
11 checks passed
@cguedes cguedes deleted the 483-explorer-panel-design-for-multiple-projects branch September 11, 2023 13:11
@hammer
Copy link
Contributor

hammer commented Sep 11, 2023

As part of this change can we create a top-level folder called "documents", put it above exports and uploads, and put the documents under there?

@hammer
Copy link
Contributor

hammer commented Sep 11, 2023

Or if that breaks the data model, we should at least have the documents above the exports and uploads, I think.

@cguedes
Copy link
Collaborator Author

cguedes commented Sep 11, 2023

That change of having a top-level documents folder is a bit complex in terms of data model and UI logic to make it expanded (when opening a project, creating a new file, ...).

But showing the files before folders (i.e. above exports and uploads) should be very simple. We will do that in a follow-up PR.

CC @sehyod

@sehyod
Copy link
Collaborator

sehyod commented Sep 11, 2023

I created the issue: #536

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.

Explorer panel design for multiple projects
3 participants