Integration of folders mode with Google Drive/GitHub

[sumomomomomo]

Description

Resolves #2404
Resolves #2405
Blocked by #2762

No playground PersistenceFile

Save

Button is disabled.

Save As

Google Drive picker is opened, user chooses to create new file, or overwrite existing file.
Github is the same.

Both:
Playground PersistenceFile is not set.

Save All

Both:
Checks if only a single top level folder is present. If it is not present or there are multiple files/folders in the root directory, will open an error dialog.

Google Drive:
Google Drive picker is opened, user chooses a location to save the top level folder. If folder of the same name exists in the chosen location, confirmation dialog appears, warning user that for files with filenames overlapping locally and remotely, their remote contents will be updated. New files will be created remotely if they are not found. No files will be removed remotely.

Github:
Github picker is opened, user chooses a location to save the top level folder. There will be no warning and any files with the same path will be overwritten.

Both:
Playground PersistenceFile set with isFolder: true, and name of top level folder. persistenceFileArray populated with all files/folders.

Create/Delete/Rename

As persistenceFileArray is empty, these functions will not call any Google Drive API or Github functions

Playground PersistenceFile is of a File, not Folder

Save

Saves file, updates lastSaved of playground PersistenceFile.

Save As

Google Drive picker is opened, user chooses to create new file, or overwrite existing file.
Github is the same.
Playground PersistenceFile is not set.

Save All

(Identical behaviour to Save All with no playground PersistenceFile)

Create/Delete/Rename

As persistenceFileArray is empty, these functions will not call any Google Drive API or Github functions.

Playground PersistenceFile is of a Folder

Save

Saves file, updates lastSaved of PersistenceFileArray entry of saved file.
If because of this save, for all files, if lastSaved is more recent than lastEdit, then lastSaved of playground PersistenceFile will also update.

Save As

Picker for Google Drive or Github is opened, user chooses to create new file, or overwrite existing file.
If user picks a location tracked under top level folder, persistenceFileArray entry of target file will be updated.
If because of this overwriting save as operation, for all files in persistenceFileArray, if lastSaved is more recent than lastEdit, then lastSaved of playground PersistenceFile will also update.

Save All

For each file entry in persistenceFileArray, calls Google Drive API or Github function to update their content, and their lastSaved will be updated.
Playground PersistenceFile lastSaved is updated.

Create/Delete/Rename

Each function will get the target file/folder's entry in persistenceFileArray, and call respective Google Drive API functions or Github functions to create/delete/rename.
For create/delete/rename, persistenceFileArray will be updated accordingly to add/remove/rename entries.
If folders are renamed, all child files/folder entries in persistenceFileArray are also renamed accordingly.
If folders are deleted, all child files/folder entries in persistenceFileArray are also deleted.
If top level folder is renamed, playground PersistenceFile name entry will be updated.
If top level folder is deleted, playground PersistenceFile will update to undefined.

Currently implemented features

• Opening of folders for Google Drive and Github
• Save, Save All, Save As for Google Drive and Github
• Instantaneous sync for creating/renaming/deleting files/folders for Google Drive and Github
• Right now, GDrive/Github cannot be used simultaneously to sync a folder. Top bar is greyed out for the other persistence provider when one persistence provider is syncing.

UI

• Blue/yellow coloured icons in fileSystemView and control bar for visual feedback on whether a file has been edited
• Files view refreshes on completion of any operation that involves BrowserFS
• Files context menu is disabled/re-enabled with corresponding greying out on any operation that involves BrowserFS

TODO:

• Add issue: Fix instantaneous sync functions + Save/Save As/Save all, so that they work even when both GDrive/Github are active. Right now they are written to work when only 1 persistence provider is active.
• Add issue: Verify tests/create more if necessary - we don't have any new unit tests for the code right now
• Add issue for lazy loading - potential optimization
• Add issue: - Handle cases where user tries to rename/create file/folder but it already exists remotely - For Google Drive, remote files are renamed automatically by Google (eg f.js exists remotely, when user instant syncs to rename a.js to f.js, already present f.js is renamed to f (1).js in Google Drive)
• Add issue: Add logic to handle open single files when folder is already loaded prior - maybe an import button
• Add issue: Right now have disabled GDrive/Github buttons when workspaceLocation is not 'playground' - to modify code to get it to work with 'sicp'
• Add issue: Make persistenceFileArray persist between browser refreshes? - both GDrive and Github lose sync on refresh right now
• Add issue: Change functions in GithubUtils to use underlying github REST api so that multiple file changes/deletions/renaming can be done in one commit (Github)
• Add issue: File picker for Github does not update after instant sync rename file/folder
• Add issue: User cannot currently open an entire repository as a folder (Github)

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update
• Code quality improvements

How to test

No specific instructions to test apart from what is outlined in the wiki for obtaining Google/Github API keys and inserting them into .env.

Checklist

• I have tested this code
• I have updated the documentation