Implement a Git Provider is easy. It is a class or object that implements the GitProvider
interface.
export interface GitProvider {onPut: (key: string, value: string) => Promise<void>onDelete: (key: string) => Promise<void>}
onPut
This is used to save content to Git. It is called whenever a value is saved in the CMS.
onDelete
This is used to delete content from Git. It is called whenever a value is deleted in the CMS.
Here is the source code for the GitHub Git Provider. It is a good example of how to implement the GitProvider
interface.
import { Octokit } from '@octokit/rest'import { Base64 } from 'js-base64'import type { GitProvider } from '@tinacms/graphql'type OctokitOptions = ConstructorParameters<typeof Octokit>[0]export interface GitHubProviderOptions {owner: stringrepo: stringtoken: stringbranch: stringcommitMessage?: stringrootPath?: stringoctokitOptions?: OctokitOptions}export class MyGitHubProvider implements GitProvider {octokit: Octokitowner: stringrepo: stringbranch: stringrootPath?: stringcommitMessage?: stringconstructor(args: GitHubProviderOptions) {this.owner = args.ownerthis.repo = args.repothis.branch = args.branchthis.commitMessage = args.commitMessagethis.rootPath = args.rootPaththis.octokit = new Octokit({auth: args.token,...(args.octokitOptions || {}),})}async onPut(key: string, value: string) {let shaconst keyWithPath = this.rootPath ? `${this.rootPath}/${key}` : keytry {const {// @ts-ignoredata: { sha: existingSha },} = await this.octokit.repos.getContent({owner: this.owner,repo: this.repo,path: keyWithPath,ref: this.branch,})sha = existingSha} catch (e) {}await this.octokit.repos.createOrUpdateFileContents({owner: this.owner,repo: this.repo,path: keyWithPath,message: this.commitMessage || 'Edited with TinaCMS',content: Base64.encode(value),branch: this.branch,sha,})}async onDelete(key: string) {let shaconst keyWithPath = this.rootPath ? `${this.rootPath}/${key}` : keytry {const {// @ts-ignoredata: { sha: existingSha },} = await this.octokit.repos.getContent({owner: this.owner,repo: this.repo,path: keyWithPath,ref: this.branch,})sha = existingSha} catch (e) {}if (sha) {await this.octokit.repos.deleteFile({owner: this.owner,repo: this.repo,path: keyWithPath,message: this.commitMessage || 'Edited with TinaCMS',branch: this.branch,sha,})} else {throw new Error(`Could not find file ${keyWithPath} in repo ${this.owner}/${this.repo}`)}}}
This can now be used as a prop to the createDatabase
function.
database.ts,js:
import { createDatabase, createLocalDatabase } from '@tinacms/datalayer'import { MyGitHubProvider } from './my-git-provider'//...export default isLocal ? createLocalDatabase() ? createDatabase({gitProvider: new MyGitHubProvider({//... Options}),// ...})
© TinaCMS 2019–2024