obsidian-confluence 5.6.13 → 5.6.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/package.json +3 -3
  2. package/src/CompletedModal.tsx +124 -132
  3. package/src/ConfluencePerPageForm.tsx +466 -469
  4. package/src/ConfluenceSettingTab.ts +108 -108
  5. package/src/MyBaseClient.ts +193 -200
  6. package/src/adaptors/obsidian.ts +124 -126
  7. package/src/custom.d.ts +8 -8
  8. package/src/main.ts +446 -478
package/src/ConfluencePerPageForm.tsx CHANGED
@@ -5,521 +5,518 @@ import { ConfluencePageConfig } from "md-confluence-lib";
5
5
  import { Property } from "csstype";
6
6
 
7
7
  export type ConfluencePerPageUIValues = {
8
- [K in keyof ConfluencePageConfig.ConfluencePerPageConfig]: {
9
- value:
10
- | ConfluencePageConfig.ConfluencePerPageConfig[K]["default"]
11
- | undefined;
12
- isSet: boolean;
13
- };
8
+ [K in keyof ConfluencePageConfig.ConfluencePerPageConfig]: {
9
+ value:
10
+ | ConfluencePageConfig.ConfluencePerPageConfig[K]["default"]
11
+ | undefined;
12
+ isSet: boolean;
13
+ };
14
14
  };
15
15
 
16
16
  export function mapFrontmatterToConfluencePerPageUIValues(
17
- frontmatter: FrontMatterCache | undefined,
17
+ frontmatter: FrontMatterCache | undefined,
18
18
  ): ConfluencePerPageUIValues {
19
- const config = ConfluencePageConfig.conniePerPageConfig;
20
- const result: Partial<ConfluencePerPageUIValues> = {};
19
+ const config = ConfluencePageConfig.conniePerPageConfig;
20
+ const result: Partial<ConfluencePerPageUIValues> = {};
21
21
 
22
- if (!frontmatter) {
23
- throw new Error("Missing frontmatter");
24
- }
22
+ if (!frontmatter) {
23
+ throw new Error("Missing frontmatter");
24
+ }
25
25
 
26
- for (const propertyKey in config) {
27
- if (config.hasOwnProperty(propertyKey)) {
28
- const {
29
- key,
30
- inputType,
31
- default: defaultValue,
32
- } = config[
33
- propertyKey as keyof ConfluencePageConfig.ConfluencePerPageConfig
34
- ];
35
- const frontmatterValue = frontmatter[key];
26
+ for (const propertyKey in config) {
27
+ if (config.hasOwnProperty(propertyKey)) {
28
+ const {
29
+ key,
30
+ inputType,
31
+ default: defaultValue,
32
+ } = config[
33
+ propertyKey as keyof ConfluencePageConfig.ConfluencePerPageConfig
34
+ ];
35
+ const frontmatterValue = frontmatter[key];
36
36
 
37
- if (frontmatterValue !== undefined) {
38
- result[propertyKey as keyof ConfluencePerPageUIValues] = {
39
- value: frontmatterValue,
40
- isSet: true,
41
- };
42
- } else {
43
- switch (inputType) {
44
- case "options":
45
- case "array-text":
46
- result[propertyKey as keyof ConfluencePerPageUIValues] =
47
- { value: defaultValue as never, isSet: false };
48
- break;
49
- case "boolean":
50
- case "text":
51
- result[propertyKey as keyof ConfluencePerPageUIValues] =
52
- { value: undefined, isSet: false };
53
- break;
54
- default:
55
- throw new Error("Missing case for inputType");
56
- }
57
- }
58
- }
59
- }
60
- return result as ConfluencePerPageUIValues;
37
+ if (frontmatterValue !== undefined) {
38
+ result[propertyKey as keyof ConfluencePerPageUIValues] = {
39
+ value: frontmatterValue,
40
+ isSet: true,
41
+ };
42
+ } else {
43
+ switch (inputType) {
44
+ case "options":
45
+ case "array-text":
46
+ result[propertyKey as keyof ConfluencePerPageUIValues] = {
47
+ value: defaultValue as never,
48
+ isSet: false,
49
+ };
50
+ break;
51
+ case "boolean":
52
+ case "text":
53
+ result[propertyKey as keyof ConfluencePerPageUIValues] = {
54
+ value: undefined,
55
+ isSet: false,
56
+ };
57
+ break;
58
+ default:
59
+ throw new Error("Missing case for inputType");
60
+ }
61
+ }
62
+ }
63
+ }
64
+ return result as ConfluencePerPageUIValues;
61
65
  }
62
66
 
63
67
  interface FormProps {
64
- config: ConfluencePageConfig.ConfluencePerPageConfig;
65
- initialValues: ConfluencePerPageUIValues;
66
- onSubmit: (values: ConfluencePerPageUIValues) => void;
68
+ config: ConfluencePageConfig.ConfluencePerPageConfig;
69
+ initialValues: ConfluencePerPageUIValues;
70
+ onSubmit: (values: ConfluencePerPageUIValues) => void;
67
71
  }
68
72
 
69
73
  interface ModalProps {
70
- config: ConfluencePageConfig.ConfluencePerPageConfig;
71
- initialValues: ConfluencePerPageUIValues;
72
- onSubmit: (values: ConfluencePerPageUIValues, close: () => void) => void;
74
+ config: ConfluencePageConfig.ConfluencePerPageConfig;
75
+ initialValues: ConfluencePerPageUIValues;
76
+ onSubmit: (values: ConfluencePerPageUIValues, close: () => void) => void;
73
77
  }
74
78
 
75
79
  const handleChange = (
76
- key: string,
77
- value: unknown,
78
- inputValidator: ConfluencePageConfig.InputValidator<unknown>,
79
- setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
80
- setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
81
- isSetValue: boolean,
80
+ key: string,
81
+ value: unknown,
82
+ inputValidator: ConfluencePageConfig.InputValidator<unknown>,
83
+ setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
84
+ setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
85
+ isSetValue: boolean,
82
86
  ) => {
83
- const validationResult = inputValidator(value);
87
+ const validationResult = inputValidator(value);
84
88
 
85
- setValues((prevValues) => ({
86
- ...prevValues,
87
- [key]: {
88
- ...prevValues[key as keyof ConfluencePerPageUIValues],
89
- ...(isSetValue ? { isSet: value } : { value }),
90
- },
91
- }));
92
- setErrors((prevErrors) => ({
93
- ...prevErrors,
94
- [key]: validationResult.valid ? [] : validationResult.errors,
95
- }));
89
+ setValues((prevValues) => ({
90
+ ...prevValues,
91
+ [key]: {
92
+ ...prevValues[key as keyof ConfluencePerPageUIValues],
93
+ ...(isSetValue ? { isSet: value } : { value }),
94
+ },
95
+ }));
96
+ setErrors((prevErrors) => ({
97
+ ...prevErrors,
98
+ [key]: validationResult.valid ? [] : validationResult.errors,
99
+ }));
96
100
  };
97
101
 
98
102
  const styles = {
99
- errorTd: {
100
- columnSpan: "all" as Property.ColumnSpan,
101
- color: "red",
102
- },
103
+ errorTd: {
104
+ columnSpan: "all" as Property.ColumnSpan,
105
+ color: "red",
106
+ },
103
107
  };
104
108
 
105
109
  const renderTextInput = (
106
- key: string,
107
- config: ConfluencePageConfig.FrontmatterConfig<string, "text">,
108
- values: ConfluencePerPageUIValues,
109
- errors: Record<string, Error[]>,
110
- setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
111
- setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
110
+ key: string,
111
+ config: ConfluencePageConfig.FrontmatterConfig<string, "text">,
112
+ values: ConfluencePerPageUIValues,
113
+ errors: Record<string, Error[]>,
114
+ setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
115
+ setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
112
116
  ) => (
113
- <>
114
- <tr key={key}>
115
- <td>
116
- <label htmlFor={key}>{config.key}</label>
117
- </td>
118
- <td>
119
- <input
120
- type="text"
121
- id={key}
122
- value={
123
- (values[key as keyof ConfluencePerPageUIValues]
124
- .value as string) ?? ""
125
- }
126
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
127
- handleChange(
128
- key,
129
- e.target.value,
130
- config.inputValidator,
131
- setValues,
132
- setErrors,
133
- false,
134
- )
135
- }
136
- />
137
- </td>
138
- <td>
139
- <input
140
- type="checkbox"
141
- id={`${key}-isSet`}
142
- checked={
143
- values[key as keyof ConfluencePerPageUIValues]
144
- .isSet as boolean
145
- }
146
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
147
- handleChange(
148
- key,
149
- e.target.checked,
150
- config.inputValidator,
151
- setValues,
152
- setErrors,
153
- true,
154
- )
155
- }
156
- />
157
- </td>
158
- </tr>
159
- <tr key={`${key}-errors`}>
160
- {(errors[key]?.length ?? 0) > 0 && (
161
- <td colSpan={3}>
162
- <div className="error" style={styles.errorTd}>
163
- {(errors[key] ?? []).map((error) => (
164
- <p key={error.message}>{error.message}</p>
165
- ))}
166
- </div>
167
- </td>
168
- )}
169
- </tr>
170
- </>
117
+ <>
118
+ <tr key={key}>
119
+ <td>
120
+ <label htmlFor={key}>{config.key}</label>
121
+ </td>
122
+ <td>
123
+ <input
124
+ type="text"
125
+ id={key}
126
+ value={
127
+ (values[key as keyof ConfluencePerPageUIValues].value as string) ??
128
+ ""
129
+ }
130
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
131
+ handleChange(
132
+ key,
133
+ e.target.value,
134
+ config.inputValidator,
135
+ setValues,
136
+ setErrors,
137
+ false,
138
+ )
139
+ }
140
+ />
141
+ </td>
142
+ <td>
143
+ <input
144
+ type="checkbox"
145
+ id={`${key}-isSet`}
146
+ checked={
147
+ values[key as keyof ConfluencePerPageUIValues].isSet as boolean
148
+ }
149
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
150
+ handleChange(
151
+ key,
152
+ e.target.checked,
153
+ config.inputValidator,
154
+ setValues,
155
+ setErrors,
156
+ true,
157
+ )
158
+ }
159
+ />
160
+ </td>
161
+ </tr>
162
+ <tr key={`${key}-errors`}>
163
+ {(errors[key]?.length ?? 0) > 0 && (
164
+ <td colSpan={3}>
165
+ <div className="error" style={styles.errorTd}>
166
+ {(errors[key] ?? []).map((error) => (
167
+ <p key={error.message}>{error.message}</p>
168
+ ))}
169
+ </div>
170
+ </td>
171
+ )}
172
+ </tr>
173
+ </>
171
174
  );
172
175
 
173
176
  const renderArrayText = (
174
- key: string,
175
- config: ConfluencePageConfig.FrontmatterConfig<string[], "array-text">,
176
- values: ConfluencePerPageUIValues,
177
- errors: Record<string, Error[]>,
178
- setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
179
- setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
177
+ key: string,
178
+ config: ConfluencePageConfig.FrontmatterConfig<string[], "array-text">,
179
+ values: ConfluencePerPageUIValues,
180
+ errors: Record<string, Error[]>,
181
+ setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
182
+ setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
180
183
  ) => (
181
- <>
182
- <tr key={key}>
183
- <td>
184
- <label htmlFor={key}>{config.key}</label>
185
- </td>
186
- <td>
187
- {(
188
- values[key as keyof ConfluencePerPageUIValues]
189
- .value as unknown as string[]
190
- ).map((value, index) => (
191
- <input
192
- key={`${key}-${index}`}
193
- type="text"
194
- value={value}
195
- onChange={(e: ChangeEvent<HTMLInputElement>) => {
196
- const newArray = [
197
- ...(values[
198
- key as keyof ConfluencePerPageUIValues
199
- ].value as unknown as string[]),
200
- ];
201
- newArray[index] = e.target.value;
202
- handleChange(
203
- key,
204
- newArray,
205
- config.inputValidator,
206
- setValues,
207
- setErrors,
208
- false,
209
- );
210
- }}
211
- />
212
- ))}
213
- <button
214
- type="button"
215
- onClick={() => {
216
- const newArray = [
217
- ...(values[key as keyof ConfluencePerPageUIValues]
218
- .value as string[]),
219
- "",
220
- ];
221
- handleChange(
222
- key,
223
- newArray,
224
- config.inputValidator,
225
- setValues,
226
- setErrors,
227
- false,
228
- );
229
- }}
230
- >
231
- +
232
- </button>
233
- </td>
234
- <td>
235
- <input
236
- type="checkbox"
237
- id={`${key}-isSet`}
238
- checked={
239
- values[key as keyof ConfluencePerPageUIValues]
240
- .isSet as boolean
241
- }
242
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
243
- handleChange(
244
- key,
245
- e.target.checked,
246
- config.inputValidator,
247
- setValues,
248
- setErrors,
249
- true,
250
- )
251
- }
252
- />
253
- </td>
254
- </tr>
255
- <tr key={`${key}-errors`}>
256
- {(errors[key]?.length ?? 0) > 0 && (
257
- <td colSpan={3}>
258
- <div className="error" style={styles.errorTd}>
259
- {(errors[key] ?? []).map((error) => (
260
- <p key={error.message}>{error.message}</p>
261
- ))}
262
- </div>
263
- </td>
264
- )}
265
- </tr>
266
- </>
184
+ <>
185
+ <tr key={key}>
186
+ <td>
187
+ <label htmlFor={key}>{config.key}</label>
188
+ </td>
189
+ <td>
190
+ {(
191
+ values[key as keyof ConfluencePerPageUIValues]
192
+ .value as unknown as string[]
193
+ ).map((value, index) => (
194
+ <input
195
+ key={`${key}-${index}`}
196
+ type="text"
197
+ value={value}
198
+ onChange={(e: ChangeEvent<HTMLInputElement>) => {
199
+ const newArray = [
200
+ ...(values[key as keyof ConfluencePerPageUIValues]
201
+ .value as unknown as string[]),
202
+ ];
203
+ newArray[index] = e.target.value;
204
+ handleChange(
205
+ key,
206
+ newArray,
207
+ config.inputValidator,
208
+ setValues,
209
+ setErrors,
210
+ false,
211
+ );
212
+ }}
213
+ />
214
+ ))}
215
+ <button
216
+ type="button"
217
+ onClick={() => {
218
+ const newArray = [
219
+ ...(values[key as keyof ConfluencePerPageUIValues]
220
+ .value as string[]),
221
+ "",
222
+ ];
223
+ handleChange(
224
+ key,
225
+ newArray,
226
+ config.inputValidator,
227
+ setValues,
228
+ setErrors,
229
+ false,
230
+ );
231
+ }}
232
+ >
233
+ +
234
+ </button>
235
+ </td>
236
+ <td>
237
+ <input
238
+ type="checkbox"
239
+ id={`${key}-isSet`}
240
+ checked={
241
+ values[key as keyof ConfluencePerPageUIValues].isSet as boolean
242
+ }
243
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
244
+ handleChange(
245
+ key,
246
+ e.target.checked,
247
+ config.inputValidator,
248
+ setValues,
249
+ setErrors,
250
+ true,
251
+ )
252
+ }
253
+ />
254
+ </td>
255
+ </tr>
256
+ <tr key={`${key}-errors`}>
257
+ {(errors[key]?.length ?? 0) > 0 && (
258
+ <td colSpan={3}>
259
+ <div className="error" style={styles.errorTd}>
260
+ {(errors[key] ?? []).map((error) => (
261
+ <p key={error.message}>{error.message}</p>
262
+ ))}
263
+ </div>
264
+ </td>
265
+ )}
266
+ </tr>
267
+ </>
267
268
  );
268
269
 
269
270
  const renderBoolean = (
270
- key: string,
271
- config: ConfluencePageConfig.FrontmatterConfig<boolean, "boolean">,
272
- values: ConfluencePerPageUIValues,
273
- errors: Record<string, Error[]>,
274
- setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
275
- setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
271
+ key: string,
272
+ config: ConfluencePageConfig.FrontmatterConfig<boolean, "boolean">,
273
+ values: ConfluencePerPageUIValues,
274
+ errors: Record<string, Error[]>,
275
+ setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
276
+ setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
276
277
  ) => (
277
- <>
278
- <tr key={key}>
279
- <td>
280
- <label htmlFor={key}>{config.key}</label>
281
- </td>
282
- <td>
283
- <input
284
- type="checkbox"
285
- id={key}
286
- checked={
287
- values[key as keyof ConfluencePerPageUIValues]
288
- .value as boolean
289
- }
290
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
291
- handleChange(
292
- key,
293
- e.target.checked,
294
- config.inputValidator,
295
- setValues,
296
- setErrors,
297
- false,
298
- )
299
- }
300
- />
301
- </td>
302
- <td>
303
- <input
304
- type="checkbox"
305
- id={`${key}-isSet`}
306
- checked={
307
- values[key as keyof ConfluencePerPageUIValues]
308
- .isSet as boolean
309
- }
310
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
311
- handleChange(
312
- key,
313
- e.target.checked,
314
- config.inputValidator,
315
- setValues,
316
- setErrors,
317
- true,
318
- )
319
- }
320
- />
321
- </td>
322
- </tr>
323
- <tr key={`${key}-errors`}>
324
- {(errors[key]?.length ?? 0) > 0 && (
325
- <td colSpan={3}>
326
- <div className="error" style={styles.errorTd}>
327
- {(errors[key] ?? []).map((error) => (
328
- <p key={error.message}>{error.message}</p>
329
- ))}
330
- </div>
331
- </td>
332
- )}
333
- </tr>
334
- </>
278
+ <>
279
+ <tr key={key}>
280
+ <td>
281
+ <label htmlFor={key}>{config.key}</label>
282
+ </td>
283
+ <td>
284
+ <input
285
+ type="checkbox"
286
+ id={key}
287
+ checked={
288
+ values[key as keyof ConfluencePerPageUIValues].value as boolean
289
+ }
290
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
291
+ handleChange(
292
+ key,
293
+ e.target.checked,
294
+ config.inputValidator,
295
+ setValues,
296
+ setErrors,
297
+ false,
298
+ )
299
+ }
300
+ />
301
+ </td>
302
+ <td>
303
+ <input
304
+ type="checkbox"
305
+ id={`${key}-isSet`}
306
+ checked={
307
+ values[key as keyof ConfluencePerPageUIValues].isSet as boolean
308
+ }
309
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
310
+ handleChange(
311
+ key,
312
+ e.target.checked,
313
+ config.inputValidator,
314
+ setValues,
315
+ setErrors,
316
+ true,
317
+ )
318
+ }
319
+ />
320
+ </td>
321
+ </tr>
322
+ <tr key={`${key}-errors`}>
323
+ {(errors[key]?.length ?? 0) > 0 && (
324
+ <td colSpan={3}>
325
+ <div className="error" style={styles.errorTd}>
326
+ {(errors[key] ?? []).map((error) => (
327
+ <p key={error.message}>{error.message}</p>
328
+ ))}
329
+ </div>
330
+ </td>
331
+ )}
332
+ </tr>
333
+ </>
335
334
  );
336
335
  const renderOptions = (
337
- key: string,
338
- config: ConfluencePageConfig.FrontmatterConfig<
339
- ConfluencePageConfig.PageContentType,
340
- "options"
341
- >,
342
- values: ConfluencePerPageUIValues,
343
- errors: Record<string, Error[]>,
344
- setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
345
- setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
336
+ key: string,
337
+ config: ConfluencePageConfig.FrontmatterConfig<
338
+ ConfluencePageConfig.PageContentType,
339
+ "options"
340
+ >,
341
+ values: ConfluencePerPageUIValues,
342
+ errors: Record<string, Error[]>,
343
+ setValues: React.Dispatch<React.SetStateAction<ConfluencePerPageUIValues>>,
344
+ setErrors: React.Dispatch<React.SetStateAction<Record<string, Error[]>>>,
346
345
  ) => (
347
- <>
348
- <tr key={key}>
349
- <td>
350
- <label htmlFor={key}>{config.key}</label>
351
- </td>
352
- <td>
353
- <select
354
- id={key}
355
- value={
356
- values[key as keyof ConfluencePerPageUIValues]
357
- .value as ConfluencePageConfig.PageContentType
358
- }
359
- onChange={(e: ChangeEvent<HTMLSelectElement>) =>
360
- handleChange(
361
- key,
362
- e.target
363
- .value as ConfluencePageConfig.PageContentType,
364
- config.inputValidator,
365
- setValues,
366
- setErrors,
367
- false,
368
- )
369
- }
370
- >
371
- {config.selectOptions.map((option) => (
372
- <option key={option} value={option}>
373
- {option}
374
- </option>
375
- ))}
376
- </select>
377
- </td>
378
- <td>
379
- <input
380
- type="checkbox"
381
- id={`${key}-isSet`}
382
- checked={
383
- values[key as keyof ConfluencePerPageUIValues]
384
- .isSet as boolean
385
- }
386
- onChange={(e: ChangeEvent<HTMLInputElement>) =>
387
- handleChange(
388
- key,
389
- e.target.checked,
390
- config.inputValidator,
391
- setValues,
392
- setErrors,
393
- true,
394
- )
395
- }
396
- />
397
- </td>
398
- </tr>
399
- <tr key={`${key}-errors`}>
400
- {(errors[key]?.length ?? 0) > 0 && (
401
- <td colSpan={3}>
402
- <div className="error" style={styles.errorTd}>
403
- {(errors[key] ?? []).map((error) => (
404
- <p key={error.message}>{error.message}</p>
405
- ))}
406
- </div>
407
- </td>
408
- )}
409
- </tr>
410
- </>
346
+ <>
347
+ <tr key={key}>
348
+ <td>
349
+ <label htmlFor={key}>{config.key}</label>
350
+ </td>
351
+ <td>
352
+ <select
353
+ id={key}
354
+ value={
355
+ values[key as keyof ConfluencePerPageUIValues]
356
+ .value as ConfluencePageConfig.PageContentType
357
+ }
358
+ onChange={(e: ChangeEvent<HTMLSelectElement>) =>
359
+ handleChange(
360
+ key,
361
+ e.target.value as ConfluencePageConfig.PageContentType,
362
+ config.inputValidator,
363
+ setValues,
364
+ setErrors,
365
+ false,
366
+ )
367
+ }
368
+ >
369
+ {config.selectOptions.map((option) => (
370
+ <option key={option} value={option}>
371
+ {option}
372
+ </option>
373
+ ))}
374
+ </select>
375
+ </td>
376
+ <td>
377
+ <input
378
+ type="checkbox"
379
+ id={`${key}-isSet`}
380
+ checked={
381
+ values[key as keyof ConfluencePerPageUIValues].isSet as boolean
382
+ }
383
+ onChange={(e: ChangeEvent<HTMLInputElement>) =>
384
+ handleChange(
385
+ key,
386
+ e.target.checked,
387
+ config.inputValidator,
388
+ setValues,
389
+ setErrors,
390
+ true,
391
+ )
392
+ }
393
+ />
394
+ </td>
395
+ </tr>
396
+ <tr key={`${key}-errors`}>
397
+ {(errors[key]?.length ?? 0) > 0 && (
398
+ <td colSpan={3}>
399
+ <div className="error" style={styles.errorTd}>
400
+ {(errors[key] ?? []).map((error) => (
401
+ <p key={error.message}>{error.message}</p>
402
+ ))}
403
+ </div>
404
+ </td>
405
+ )}
406
+ </tr>
407
+ </>
411
408
  );
412
409
 
413
410
  const ConfluenceForm: React.FC<FormProps> = ({
414
- config,
415
- initialValues,
416
- onSubmit,
411
+ config,
412
+ initialValues,
413
+ onSubmit,
417
414
  }) => {
418
- const [values, setValues] =
419
- useState<ConfluencePerPageUIValues>(initialValues);
420
- const [errors, setErrors] = useState<Record<string, Error[]>>({});
415
+ const [values, setValues] =
416
+ useState<ConfluencePerPageUIValues>(initialValues);
417
+ const [errors, setErrors] = useState<Record<string, Error[]>>({});
421
418
 
422
- const handleSubmit = (e: React.FormEvent) => {
423
- e.preventDefault();
424
- onSubmit(values as ConfluencePerPageUIValues);
425
- };
419
+ const handleSubmit = (e: React.FormEvent) => {
420
+ e.preventDefault();
421
+ onSubmit(values as ConfluencePerPageUIValues);
422
+ };
426
423
 
427
- return (
428
- <form onSubmit={handleSubmit}>
429
- <h1>Update Confluence Page Settings</h1>
430
- <table>
431
- <thead>
432
- <tr>
433
- <td>YAML Key</td>
434
- <td>Value</td>
435
- <td>Update</td>
436
- </tr>
437
- </thead>
438
- <tbody>
439
- {Object.entries(config).map(([key, config]) => {
440
- switch (config.inputType) {
441
- case "text":
442
- return renderTextInput(
443
- key,
444
- config as ConfluencePageConfig.FrontmatterConfig<
445
- string,
446
- "text"
447
- >,
448
- values,
449
- errors,
450
- setValues,
451
- setErrors,
452
- );
453
- case "array-text":
454
- return renderArrayText(
455
- key,
456
- config as ConfluencePageConfig.FrontmatterConfig<
457
- string[],
458
- "array-text"
459
- >,
460
- values,
461
- errors,
462
- setValues,
463
- setErrors,
464
- );
465
- case "boolean":
466
- return renderBoolean(
467
- key,
468
- config as ConfluencePageConfig.FrontmatterConfig<
469
- boolean,
470
- "boolean"
471
- >,
472
- values,
473
- errors,
474
- setValues,
475
- setErrors,
476
- );
477
- case "options":
478
- return renderOptions(
479
- key,
480
- config as ConfluencePageConfig.FrontmatterConfig<
481
- ConfluencePageConfig.PageContentType,
482
- "options"
483
- >,
484
- values,
485
- errors,
486
- setValues,
487
- setErrors,
488
- );
489
- default:
490
- return null;
491
- }
492
- })}
493
- </tbody>
494
- </table>
495
- <button type="submit">Submit</button>
496
- </form>
497
- );
424
+ return (
425
+ <form onSubmit={handleSubmit}>
426
+ <h1>Update Confluence Page Settings</h1>
427
+ <table>
428
+ <thead>
429
+ <tr>
430
+ <td>YAML Key</td>
431
+ <td>Value</td>
432
+ <td>Update</td>
433
+ </tr>
434
+ </thead>
435
+ <tbody>
436
+ {Object.entries(config).map(([key, config]) => {
437
+ switch (config.inputType) {
438
+ case "text":
439
+ return renderTextInput(
440
+ key,
441
+ config as ConfluencePageConfig.FrontmatterConfig<
442
+ string,
443
+ "text"
444
+ >,
445
+ values,
446
+ errors,
447
+ setValues,
448
+ setErrors,
449
+ );
450
+ case "array-text":
451
+ return renderArrayText(
452
+ key,
453
+ config as ConfluencePageConfig.FrontmatterConfig<
454
+ string[],
455
+ "array-text"
456
+ >,
457
+ values,
458
+ errors,
459
+ setValues,
460
+ setErrors,
461
+ );
462
+ case "boolean":
463
+ return renderBoolean(
464
+ key,
465
+ config as ConfluencePageConfig.FrontmatterConfig<
466
+ boolean,
467
+ "boolean"
468
+ >,
469
+ values,
470
+ errors,
471
+ setValues,
472
+ setErrors,
473
+ );
474
+ case "options":
475
+ return renderOptions(
476
+ key,
477
+ config as ConfluencePageConfig.FrontmatterConfig<
478
+ ConfluencePageConfig.PageContentType,
479
+ "options"
480
+ >,
481
+ values,
482
+ errors,
483
+ setValues,
484
+ setErrors,
485
+ );
486
+ default:
487
+ return null;
488
+ }
489
+ })}
490
+ </tbody>
491
+ </table>
492
+ <button type="submit">Submit</button>
493
+ </form>
494
+ );
498
495
  };
499
496
 
500
497
  export class ConfluencePerPageForm extends Modal {
501
- modalProps: ModalProps;
498
+ modalProps: ModalProps;
502
499
 
503
- constructor(app: App, modalProps: ModalProps) {
504
- super(app);
505
- this.modalProps = modalProps;
506
- }
500
+ constructor(app: App, modalProps: ModalProps) {
501
+ super(app);
502
+ this.modalProps = modalProps;
503
+ }
507
504
 
508
- override onOpen() {
509
- const { contentEl } = this;
510
- const test: FormProps = {
511
- ...this.modalProps,
512
- onSubmit: (values) => {
513
- const boundClose = this.close.bind(this);
514
- this.modalProps.onSubmit(values, boundClose);
515
- },
516
- };
517
- ReactDOM.render(React.createElement(ConfluenceForm, test), contentEl);
518
- }
505
+ override onOpen() {
506
+ const { contentEl } = this;
507
+ const test: FormProps = {
508
+ ...this.modalProps,
509
+ onSubmit: (values) => {
510
+ const boundClose = this.close.bind(this);
511
+ this.modalProps.onSubmit(values, boundClose);
512
+ },
513
+ };
514
+ ReactDOM.render(React.createElement(ConfluenceForm, test), contentEl);
515
+ }
519
516
 
520
- override onClose() {
521
- const { contentEl } = this;
522
- ReactDOM.unmountComponentAtNode(contentEl);
523
- contentEl.empty();
524
- }
517
+ override onClose() {
518
+ const { contentEl } = this;
519
+ ReactDOM.unmountComponentAtNode(contentEl);
520
+ contentEl.empty();
521
+ }
525
522
  }