[Penpot] Sync with GitHub

We are implementing the ability to store design tokens on remote storage and sync them with a GitHub repository. This feature will enable users to connect to a GitHub repo, manage their design tokens, and sync changes effectively.

The following functionalities are essential for the successful implementation of this feature:

1. Connecting to a GitHub Repository:

   • Users can connect to a GitHub repository that contains design tokens by providing the required credentials: Personal Access Token, repo name, branch name, file path, and an optional base URL.

   • Users can connect either to a single JSON file or to a folder containing multiple JSON files, including nested folders.

   • Upon successful connection, the system should sync the tokens from the repository.

2. Pushing and Pulling Changes:

   • Users can push changes made to the design tokens in the Penpot to the connected GitHub repository, creating a commit.

   • When pushing changes, users are prompted to write a commit message. The commit message cannot be blank; it must contain text.

   • Users can pull changes from the GitHub repository to sync the latest token updates.

   • Before finalizing a push or pull action, a diff should be displayed to show the changes being made.

3. Error Handling:

   • Proper error messages should be displayed if any issues occur during the connection, pushing, or pulling processes. This includes scenarios like incorrect credentials, network issues, or missing files.

4. Additional Features (Good to Have):

   • Users should be able to create a new branch directly from the Penpot interface.

   • The system should support storing more than one repository and allow users to switch between them.

   • Users should have the ability to see the list of branches on the connected repo and switch between them.

5. Behavioral Considerations:

   • If the user connects to a repo without any files, the system should display an error message indicating that there is no branch, so the process cannot proceed.

   • If the specified file is missing, and there are no tokens locally, the system should still push the metadata. If there are existing tokens locally, it should reflect all base tokens and token files from the repository in Penpot

   • If the application is closed without pushing changes to GitHub, the changes should be saved locally.

   • When the app is reopened, it should recover and display the local changes.