Create/connect workspace

[OmerGronich]

Create/Connect Workspace

Overview and Goals

• 2 main components: File explorer and list view
• The file explorer is a presented as breadcrumbs, it will be in charge of the user navigation threw out the file system.
• user can navigate by clicking on a folder or by free text.
• on user navigation the list of folders will be refreshed.
• the user can set a folder as favorite, create new folder, show hidden folders and show an Angular icon when the folder contains an Angular project.

---

Functional Requirements

File explorer:

• we need a functionality to send a path to a folder and get back a list of all it’s sub-folders.
• the sub-folders should have metadata like if the folder contains an Angular project, is is a favorite folder etc.

Workspace creation:

• Must provide the ability to create an Angular workspace with the [ng new](https://angular.io/cli/new) command
• Clicking the create workspace will open a dialog with form fields for all the possible flags to the [ng new](https://angular.io/cli/new) command

---

API’s

• get folders
• create folder
• add/remove to favorites
• create new workspace -ng new
• refresh
• get root directory - can be retrieved with nodejs os.homedir()

---

Architecture and Design

place to save the current file system absolute path - save to localStorage

if no path saved → start from root

on every path change we send the new path to the server that returns the folders list or if we have already the file system data we just show the new list of folders.

---

Data Model

interface Folder {
 name: string;
 isNG: boolean;
 favorite: boolean;
}

---

User Interface Design:
reference:

Research

• can we create a model of the entire user file system and send it all to the frontend

[ronnetzer]

Couple of notes:

1. When creating a workspace, how do we plan to handle the interactive part of ng new command?
2. Why do we need the show hidden folders feature? I don't see any reason for it
3. "user can navigate by clicking on a folder or by free text." - by free text, you mean writing the path directly in the breadcrumbs?
4. "...and show an Angular icon when the folder contains an Angular project." - this is an action done by the user? or something that will be returned by our BE?
5. favorite: boolean is missing in the data model
6. root should be better defined (add the nodejs API you'll use in order to get the home dir)
7. you should add get root directory in the APIs section

[Danieliverant]

regarding 1 - we can do it as "--interactive=flase" and the UI will have a list of optional flags (the same flags you get on the "interactive" part)

[OmerGronich]

1. Clicking the button will open a dialog with a form with all the possible options ng new can accept. Will add to the design
2. removed
3. Yes
4. From our BE, this is why the Folder interface has a isNG property
5. done
6. done
7. done

[agroupp]

I don't think it's a good idea to start with ng new. We have a lot of more important features to implement to have something to show. We will spend time now on minor features and miss the next meeting.

[OmerGronich]

It's the crucial for the domain @Tcodrz and I are working on - we can move to something else but @eliraneliassy, can you maybe help us prioritize?

[Danieliverant]

Do we want also "removals"? remove workspace, folder etc...?
Also please add "remove favorite" in the API (regardless of the previous questions)

[OmerGronich]

added remove favorite

[Danieliverant]

@OmerGronich but I dont think we have server support for that @agroupp (removing workspace)

[OmerGronich]

Removing a workspace means removing it from the list of connected workspace not actually removing the files

[Danieliverant]

right, endpoint for removing the workspace from the list

[OmerGronich]

It's part of this feature

#43 (comment)