Skip to content

Commit b023e20

Browse files
srijitcodersilvester-pari
srijitcoder
and
silvester-pari
authored
feat: unified all the globalThis git clerk related config to globalThis.gitClerkConfig (#123)
* feat: unified all the globalConfig to globalConfig.gitClerkConfig * feat: unified all the globalConfig to globalConfig.gitClerkConfig * chores: update readme * chore: readme updates --------- Co-authored-by: Silvester <[email protected]>
1 parent 3bcb0e3 commit b023e20

File tree

8 files changed

+206
-154
lines changed

8 files changed

+206
-154
lines changed

‎README.md‎

Lines changed: 132 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,13 @@ As soon as the user starts a new "Session" (PR), a fork for the target repositor
1414

1515
## Configuration
1616

17-
The configuration for git-clerk is done via the [config file](/public/config.js). In its most basic form, the config looks like this:
17+
The configuration for git-clerk is done via the [config file](/public/config.js) by setting `globalThis.gitClerkConfig`. In its most basic form, the config looks like this:
1818

1919
```js
20-
globalThis.ghConfig = {
20+
globalThis.gitClerkConfig = {
2121
// The target repository to create PRs against
2222
githubRepo: "EOX-A/git-clerk-demo",
23-
// The current user's GH token, either as string or (sync or asyn) function
23+
// The current user's GH token, either as string or (sync or async) function
2424
// Example: githubAuthToken: () => "<github-token>"
2525
// Example: githubAuthToken: () => new Promise((resolve) => fetch("<endpoint>").then(() => resolve(token))),
2626
githubAuthToken: "ghp_myGithubAuthToken",
@@ -38,25 +38,29 @@ With the `schemaMap`, one can configure which file paths are associated with whi
3838
#### `schema` and `url`
3939

4040
```js
41-
globalThis.schemaMap = [
42-
{
43-
path: "/folder-a/file.json",
44-
schema: {
45-
title: "my-schema",
46-
type: "object",
47-
properties: {
48-
foo: {
49-
type: "string"
41+
globalThis.gitClerkConfig = {
42+
[...]
43+
schemaMap: [
44+
{
45+
path: "/folder-a/file.json",
46+
schema: {
47+
title: "my-schema",
48+
type: "object",
49+
properties: {
50+
foo: {
51+
type: "string"
52+
}
5053
}
5154
}
52-
}
53-
},
54-
{
55-
path: "/folder-a/<id>/file.json",
56-
url: "https://my-schema-site.com/schemas/folder-a/schema.json",
57-
},
55+
},
56+
{
57+
path: "/folder-a/<id>/file.json",
58+
url: "https://my-schema-site.com/schemas/folder-a/schema.json",
59+
},
60+
[...]
61+
],
5862
[...]
59-
]
63+
};
6064
```
6165

6266
In this example, editing the file `/folder-a/file.json` loads the corresponding JSON schema passed via the `schema` property, whereas editing a file with the pattern `/folder-a/<id>/file.json` loads the corresponding JSON schema `https://my-schema-site.com/schemas/folder-a/schema.json`.
@@ -66,24 +70,28 @@ In this example, editing the file `/folder-a/file.json` loads the corresponding
6670
Additionally to providing a JSON schema, the form can also be autofilled with initial content:
6771

6872
```js
69-
globalThis.schemaMap = [
70-
{
71-
path: "/folder-a/file.json",
72-
schema: {
73-
title: "my-schema",
74-
type: "object",
75-
properties: {
76-
foo: {
77-
type: "string"
73+
globalThis.gitClerkConfig = {
74+
[...]
75+
schemaMap: [
76+
{
77+
path: "/folder-a/file.json",
78+
schema: {
79+
title: "my-schema",
80+
type: "object",
81+
properties: {
82+
foo: {
83+
type: "string"
84+
}
7885
}
86+
},
87+
content: {
88+
foo: "bar"
7989
}
8090
},
81-
content: {
82-
foo: "bar"
83-
}
84-
},
91+
[...]
92+
],
8593
[...]
86-
]
94+
};
8795
```
8896

8997
In this example, the generated form will automatically fill the value "bar" into the `foo` field.
@@ -93,23 +101,27 @@ In this example, the generated form will automatically fill the value "bar" into
93101
By default, the entire JSON structure is stored (commited) as a JSON file. But one can also specify a specific property which should be stored in the file instead. This is handy when e.g. editing markdown or yaml files:
94102

95103
```js
96-
globalThis.schemaMap = [
97-
{
98-
path: "/folder-a/file.md",
99-
schema: {
100-
title: "my-schema",
101-
type: "object",
102-
properties: {
103-
foo: {
104-
type: "string",
105-
format: "markdown"
104+
globalThis.gitClerkConfig = {
105+
[...]
106+
schemaMap: [
107+
{
108+
path: "/folder-a/file.md",
109+
schema: {
110+
title: "my-schema",
111+
type: "object",
112+
properties: {
113+
foo: {
114+
type: "string",
115+
format: "markdown"
116+
}
106117
}
107-
}
118+
},
119+
output: "foo"
108120
},
109-
output: "foo"
110-
},
121+
[...]
122+
],
111123
[...]
112-
]
124+
};
113125
```
114126

115127
In this example, the markdown content of `foo` is commited as file `file.md`.
@@ -125,54 +137,58 @@ An example for this setup can be seen in [here](https://github.com/EOX-A/git-cle
125137
Sometimes, multiple edits need to be done together (e.g. creating a file in the correct folder structure, putting initial content in that file, and referencing this file in a third file). To make users' lives easier, git-clerk offers automations:
126138

127139
```js
128-
globalThis.automation = [
129-
{
130-
title: "Bootstrap Product", // displayed in the UI as button
131-
description: "Bootstrap a new file with the correct folder structure and ID.", // displayed in the UI as description for this automation
132-
inputSchema: { // the input form when the user selects this automation
133-
type: "object",
134-
properties: {
135-
id: {
136-
type: "string",
137-
minLength: 1
140+
globalThis.gitClerkConfig = {
141+
[...]
142+
automation: [
143+
{
144+
title: "Bootstrap Product", // displayed in the UI as button
145+
description: "Bootstrap a new file with the correct folder structure and ID.", // displayed in the UI as description for this automation
146+
inputSchema: { // the input form when the user selects this automation
147+
type: "object",
148+
properties: {
149+
id: {
150+
type: "string",
151+
minLength: 1
152+
},
153+
title: {
154+
type: "string",
155+
minLength: 1
156+
}
138157
},
139-
title: {
140-
type: "string",
141-
minLength: 1
142-
}
158+
required: ["id", "title"]
143159
},
144-
required: ["id", "title"]
145-
},
146-
steps: [ // the steps the automation will perform
147-
{
148-
type: "add", // add a file
149-
path: (input) => `/products/${input.id}/collection.json`, // references the above defined form output property "id"
150-
content: (input) => ({ id: input.id, title: input.title }) // sets the content of the added file, referencing "id" and "title" from the form
151-
},
152-
{
153-
type: "edit", // edits an existing file
154-
path: "/products/catalog.json",
155-
transform: (content, input) => { // transforms the content of an existing file
156-
content.links = [
157-
...content.links,
158-
{
159-
rel: "child",
160-
href: `./${input.id}/collection.json`,
161-
type: "application/json",
162-
title: input.title
163-
},
164-
]
165-
return content
160+
steps: [ // the steps the automation will perform
161+
{
162+
type: "add", // add a file
163+
path: (input) => `/products/${input.id}/collection.json`, // references the above defined form output property "id"
164+
content: (input) => ({ id: input.id, title: input.title }) // sets the content of the added file, referencing "id" and "title" from the form
165+
},
166+
{
167+
type: "edit", // edits an existing file
168+
path: "/products/catalog.json",
169+
transform: (content, input) => { // transforms the content of an existing file
170+
content.links = [
171+
...content.links,
172+
{
173+
rel: "child",
174+
href: `./${input.id}/collection.json`,
175+
type: "application/json",
176+
title: input.title
177+
},
178+
]
179+
return content
180+
}
181+
},
182+
{
183+
type: "navigate", // navigates to the specified file and opens the editing view
184+
path: (input) => `/products/${input.id}/collection.json`
166185
}
167-
},
168-
{
169-
type: "navigate", // navigates to the specified file and opens the editing view
170-
path: (input) => `/products/${input.id}/collection.json`
171-
}
172-
]
173-
},
186+
]
187+
},
188+
[...]
189+
],
174190
[...]
175-
]
191+
};
176192
```
177193

178194
Automations can also be triggered via url query parameters. For this, the automation requires an additional `id` parameter which is referenced by the `automation` query parameter.
@@ -189,32 +205,40 @@ Example:
189205
Git Clerk uses `eox-jsonform` to render applications based on different JSON editor schemas. `eox-jsonform` contains editor interfaces for each of the primitive JSON types as well as a few other specialized ones. For those who need custom editor interfaces/inputs based on any custom format, they can easily build their own custom editor interface using `JSON Editor`'s `AbstractEditor` class inside `config.js`.
190206

191207
```js
192-
globalThis.customEditorInterfaces = {
193-
"some-format-key-name": {
194-
type: "string", // Any data type for the custom editor
195-
format: "any-custom-format", // Any custom format key
196-
func: CustomEditorInterface, // Build any custom editor using `JSON Editor`'s `AbstractEditor` class
197-
... // Add any key values as per your business logic
208+
globalThis.gitClerkConfig = {
209+
[...]
210+
customEditorInterfaces: {
211+
"some-format-key-name": {
212+
type: "string", // Any data type for the custom editor
213+
format: "any-custom-format", // Any custom format key
214+
func: CustomEditorInterface, // Build any custom editor using `JSON Editor`'s `AbstractEditor` class
215+
... // Add any key values as per your business logic
216+
},
198217
},
218+
[...]
199219
};
200220
```
201221

202222
An example for this setup can be seen in [here](https://github.com/EOX-A/git-clerk/blob/bfa157a499ef488fe3b0ebf3215fb9368d552496/public/config.js#L680).
203223

204224
### Generate Enums
205225

206-
Sometimes input enums need to be dynamically fetched from an API or other data source to update the schema. `globalThis.generateEnums` inside `config.js` allows users to fetch dynamic enums according to their business logic and then return the updated schema.
226+
Sometimes input enums need to be dynamically fetched from an API or other data source to update the schema. `globalThis.gitClerkConfig.generateEnums` inside `config.js` allows users to fetch dynamic enums according to their business logic and then return the updated schema.
207227

208228
```js
209-
globalThis.generateEnums = async (
210-
schemaMetaDetails,
211-
session,
212-
cache,
213-
{ getFileDetails },
214-
) => {
215-
... // Fetch dynamic enums based on the API and update the schemaMetaDetails
216-
return schemaMetaDetails; // Return the updated schema based on the processing above
217-
}
229+
globalThis.gitClerkConfig = {
230+
[...]
231+
generateEnums: async (
232+
schemaMetaDetails,
233+
session,
234+
cache,
235+
{ getFileDetails },
236+
) => {
237+
... // Fetch dynamic enums based on the API and update the schemaMetaDetails
238+
return schemaMetaDetails; // Return the updated schema based on the processing above
239+
},
240+
[...]
241+
};
218242
```
219243

220244
An example for this setup can be seen in [here](https://github.com/EOX-A/git-clerk/blob/bfa157a499ef488fe3b0ebf3215fb9368d552496/public/config.js#L724).
@@ -238,7 +262,7 @@ npm install
238262
#### Compile and Hot-Reload for Development
239263

240264
```sh
241-
npm run dev
265+
npm start
242266
```
243267

244268
#### Compile and Minify for Production

0 commit comments

Comments
 (0)