Skip to content

Add left-pane file tree view and related templates #1704

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

Open
wants to merge 12 commits into
base: main
Choose a base branch
from

Conversation

aayushkdev
Copy link
Collaborator

@aayushkdev aayushkdev commented Jun 27, 2025

fix #1682

tree.webm

Summary/Goals of this change
The goal of this PR is to introduce a collapsible file tree panel in the left pane of the project resource view. This view allows users to explore the project's CodebaseResource in a more user friendly way.

  • Clicking the chevron next to a folder toggles a dropdown view of its immediate children in the tree (left pane).

    • If the children have already been fetched, they are simply shown or hidden without making another request.
    • Directories without any children are shown without a chevron and cannot be expanded.
    • This action only affects the left pane and does not update the right pane.
  • Clicking the folder name is intended to display the list of that folder’s children in the right pane. (Not yet implemented)

  • Clicking on a file is intended to show that individual file’s details or metadata in the right pane. (Not yet implemented)

Note: This pr depends on the parent_path field introduced in #1687. To ensure tests pass and the functionality works, I’ve temporarily duplicated the necessary parts of that change here. These changes will be removed once that pr is merged.

@aayushkdev aayushkdev force-pushed the 1682-left-pane-file-tree branch from 0ffbe25 to 6172941 Compare June 27, 2025 14:08
@aayushkdev aayushkdev requested review from tdruez, Copilot and AyanSinhaMahapatra and removed request for Copilot June 27, 2025 14:32
Copilot

This comment was marked as spam.

@aayushkdev
Copy link
Collaborator Author

Hey @AyanSinhaMahapatra @tdruez can I have a review of this pr

@aayushkdev aayushkdev force-pushed the 1682-left-pane-file-tree branch from 03842ca to 7b8ba33 Compare July 4, 2025 04:45
Copy link
Contributor

@tdruez tdruez left a comment

Choose a reason for hiding this comment

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

@aayushkdev Off to a good start, see my various comments for improvements.

The naming convention needs consistency:
resource_tree, file_tree, file_tree_panel, file-tree, CodebaseResourceTree, codebase_tree, Resource Tree
Let's use CodebaseResourceTree and resource_tree everywhere rather than "file...".

You can start the implementation of the left and right panels rendering.

@aayushkdev aayushkdev force-pushed the 1682-left-pane-file-tree branch from b1f8a7f to 3d1c4b7 Compare July 7, 2025 19:16
@aayushkdev
Copy link
Collaborator Author

Hey @tdruez could you review the changes and if possible review #1687 so we can get that merged as the further pr's require it and without that I have to keep adding parent_path value to each pr temporarily

Copy link
Contributor

@tdruez tdruez left a comment

Choose a reason for hiding this comment

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

See my comments for refinements.
Once done with those, you can continue the implementation of

Clicking the folder name is intended to display the list of that folder’s children in the right pane. (Not yet implemented)

Clicking on a file is intended to show that individual file’s details or metadata in the right pane. (Not yet implemented)

url = reverse("codebase_resource_tree", kwargs={"slug": self.project1.slug})
response = self.client.get(url)
children = response.context["children"]
print(response.context)
Copy link
Contributor

Choose a reason for hiding this comment

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

Leftover.

@aayushkdev aayushkdev requested a review from tdruez July 15, 2025 09:38
@tdruez tdruez changed the title add left-pane file tree view and related templates Add left-pane file tree view and related templates Jul 16, 2025
Copy link
Contributor

@tdruez tdruez left a comment

Choose a reason for hiding this comment

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

@aayushkdev The current code is fine, you can implement the missing parts before the next review round.

Comment on lines 3017 to 3031
CodebaseResource.objects.create(
project=project1,
type=CodebaseResource.Type.DIRECTORY,
path="parent",
)
CodebaseResource.objects.create(
project=project1,
type=CodebaseResource.Type.FILE,
path="parent/child.txt",
)
CodebaseResource.objects.create(
project=project1,
type=CodebaseResource.Type.DIRECTORY,
path="empty",
)
Copy link
Contributor

Choose a reason for hiding this comment

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

Use make_resource, make_resource_file, make_resource_directory intead.

Comment on lines 3033 to 3037
qs = CodebaseResource.objects.filter(project=project1).with_has_children()
results = {r.path: r.has_children for r in qs}
self.assertTrue(results["parent"])
self.assertFalse(results["parent/child.txt"])
self.assertFalse(results["empty"])
Copy link
Contributor

Choose a reason for hiding this comment

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

You want to simplify this. Store the resource in variuable and test directly on the instance.

Better readability:

self.assertTrue(resource1.has_children())

@aayushkdev aayushkdev force-pushed the 1682-left-pane-file-tree branch from e20208a to 154d1a6 Compare July 21, 2025 20:07
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.

Create a new View to return the immediate children of a path
2 participants