Skip to content

Commit 0e7ffa3

Browse files
mrin9mrin9
committed
annotate deprecated keys with strike-through in schema
1 parent 39ba9d8 commit 0e7ffa3

File tree

3 files changed

+33
-21
lines changed

3 files changed

+33
-21
lines changed

‎src/components/schema-table.js‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,10 @@ export default class SchemaTable extends LitElement {
4141
.table .key {
4242
width: 240px;
4343
}
44+
.key.deprecated .key-label {
45+
text-decoration: line-through;
46+
}
47+
4448
.table .key-type {
4549
white-space: normal;
4650
width: 70px;
@@ -133,7 +137,7 @@ export default class SchemaTable extends LitElement {
133137
${level > 0
134138
? html`
135139
<div class='tr ${level < this.schemaExpandLevel ? 'expanded' : 'collapsed'} ${data['::type']}' data-obj='${keyLabel}'>
136-
<div class='td key' style='padding-left:${leftPadding}px'>
140+
<div class="td key ${data['::deprecated'] ? 'deprecated' : ''}" style='padding-left:${leftPadding}px'>
137141
${keyLabel || optionNumber
138142
? html`
139143
<span
@@ -148,8 +152,8 @@ export default class SchemaTable extends LitElement {
148152
${data['::type'] === 'xxx-of-option' || data['::type'] === 'xxx-of-array' || key.startsWith('::OPTION')
149153
? html`<span class="xxx-of-key" style="margin-left:-6px">${optionNumber}</span><span class="${isOneOfLabel ? 'xxx-of-key' : 'xxx-of-descr'}">${keyLabel}</span>`
150154
: keyLabel.endsWith('*')
151-
? html`<span style="display:inline-block; margin-left:-6px;"> ${keyLabel.substring(0, keyLabel.length - 1)}</span><span style='color:var(--red);'>*</span>`
152-
: html`<span style="display:inline-block; margin-left:-6px;">${keyLabel}</span>`
155+
? html`<span class="key-label" style="display:inline-block; margin-left:-6px;"> ${keyLabel.substring(0, keyLabel.length - 1)}</span><span style='color:var(--red);'>*</span>`
156+
: html`<span class="key-label" style="display:inline-block; margin-left:-6px;">${keyLabel}</span>`
153157
}
154158
</div>
155159
<div class='td key-type'>${(data['::type'] || '').includes('xxx-of') ? '' : data['::type']}</div>
@@ -159,7 +163,7 @@ export default class SchemaTable extends LitElement {
159163
}
160164
<div class='object-body'>
161165
${Object.keys(data).map((dataKey) => html`
162-
${['::description', '::type', '::props'].includes(dataKey)
166+
${['::description', '::type', '::props', '::deprecated'].includes(dataKey)
163167
? ''
164168
: html`${this.generateTree(
165169
data[dataKey]['::type'] === 'array' ? data[dataKey]['::props'] : data[dataKey],
@@ -179,12 +183,12 @@ export default class SchemaTable extends LitElement {
179183
const dataTypeCss = itemParts[0].replace('{', '').substring(0, 4).toLowerCase();
180184
return html`
181185
<div class = "tr primitive">
182-
<div class='td key' style='padding-left:${leftPadding}px' >
186+
<div class="td key ${itemParts[8]}" style='padding-left:${leftPadding}px' >
183187
${keyLabel?.endsWith('*')
184-
? html`${keyLabel.substring(0, keyLabel.length - 1)}<span style='color:var(--red);'>*</span>`
188+
? html`<span class="key-label">${keyLabel.substring(0, keyLabel.length - 1)}</span><span style='color:var(--red);'>*</span>`
185189
: key.startsWith('::OPTION')
186190
? html`<span class='xxx-of-key'>${optionNumber}</span><span class="xxx-of-descr">${keyLabel}</span>`
187-
: html`${keyLabel || html`<span class="xxx-of-descr">${itemParts[7]}</span>`}`
191+
: html`${keyLabel ? html`<span class="key-label"> ${keyLabel}</span>` : html`<span class="xxx-of-descr">${itemParts[7]}</span>`}`
188192
}
189193
</div>
190194
<div class='td key-type ${dataTypeCss}'>

‎src/components/schema-tree.js‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,9 @@ export default class SchemaTree extends LitElement {
4545
.tree .key {
4646
max-width: 300px;
4747
}
48+
.key.deprecated .key-label {
49+
text-decoration: line-through;
50+
}
4851
4952
.open-bracket{
5053
display:inline-block;
@@ -165,12 +168,14 @@ export default class SchemaTree extends LitElement {
165168
if (typeof data === 'object') {
166169
return html`
167170
<div class="tr ${level < this.schemaExpandLevel ? 'expanded' : 'collapsed'} ${data['::type'] || 'no-type-info'}">
168-
<div class='td key' style='min-width:${minFieldColWidth}px'>
171+
<div class="td key ${data['::deprecated'] ? 'deprecated' : ''}" style='min-width:${minFieldColWidth}px'>
169172
${data['::type'] === 'xxx-of-option' || data['::type'] === 'xxx-of-array' || key.startsWith('::OPTION')
170-
? html`<span class='xxx-of-key'>${keyLabel}</span><span class="xxx-of-descr">${keyDescr}</span>`
173+
? html`<span class='key-label xxx-of-key'>${keyLabel}</span><span class="xxx-of-descr">${keyDescr}</span>`
171174
: keyLabel.endsWith('*')
172-
? html`${keyLabel.substring(0, keyLabel.length - 1)}<span style='color:var(--red);'>*</span>`
173-
: html`${keyLabel === '::props' || keyLabel === '::ARRAY~OF' ? '' : keyLabel}`
175+
? html`<span class="key-label">${keyLabel.substring(0, keyLabel.length - 1)}</span><span style='color:var(--red);'>*</span>`
176+
: keyLabel === '::props' || keyLabel === '::ARRAY~OF'
177+
? ''
178+
: html`<span class="key-label">${keyLabel}<span>`
174179
}
175180
${level > 0
176181
&& !(
@@ -191,7 +196,7 @@ export default class SchemaTree extends LitElement {
191196
? html`${this.generateTree(data[0], 'xxx-of-option', '::ARRAY~OF', '', (level))}`
192197
: html`
193198
${Object.keys(data).map((dataKey) => html`
194-
${['::description', '::type', '::props'].includes(dataKey)
199+
${['::description', '::type', '::props', '::deprecated'].includes(dataKey)
195200
? data[dataKey]['::type'] === 'array' || data[dataKey]['::type'] === 'object'
196201
? html`${this.generateTree(
197202
data[dataKey]['::type'] === 'array' ? data[dataKey]['::props'] : data[dataKey],
@@ -225,16 +230,16 @@ export default class SchemaTree extends LitElement {
225230
const dataTypeCss = itemParts[0].replace('{', '').substring(0, 4).toLowerCase();
226231
return html`
227232
<div class = "tr primitive">
228-
<div class='td key' style='min-width:${minFieldColWidth}px' >
233+
<div class="td key ${itemParts[8]}" style='min-width:${minFieldColWidth}px' >
229234
${keyLabel.endsWith('*')
230-
? html`${keyLabel.substring(0, keyLabel.length - 1)}<span style='color:var(--red);'>*</span>:`
235+
? html`<span class="key-label">${keyLabel.substring(0, keyLabel.length - 1)}</span><span style='color:var(--red);'>*</span>:`
231236
: key.startsWith('::OPTION')
232-
? html`<span class='xxx-of-key'>${keyLabel}</span>`
233-
: html`${keyLabel}:`
237+
? html`<span class='key-label xxx-of-key'>${keyLabel}</span>`
238+
: html`<span class="key-label">${keyLabel}</span>:`
234239
}
235240
<span class='${dataTypeCss}'>
236241
${dataType === 'array' ? `[${itemParts[0]}]` : `${itemParts[0]}`}
237-
<span>${itemParts[1]}</span>
242+
${itemParts[1]}
238243
</span>
239244
</div>
240245
<div class='td key-descr'>

‎src/utils/schema-utils.js‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ export function getTypeInfo(schema) {
7979
info.constrain = `max ${schema.maxLength} chars`;
8080
}
8181
}
82-
info.html = `${info.type}~|~${info.readOrWriteOnly} ${info.deprecated}~|~${info.constrain}~|~${info.default}~|~${info.allowedValues}~|~${info.pattern}~|~${info.description}~|~${schema.title || ''}`;
82+
info.html = `${info.type}~|~${info.readOrWriteOnly}~|~${info.constrain}~|~${info.default}~|~${info.allowedValues}~|~${info.pattern}~|~${info.description}~|~${schema.title || ''}~|~${info.deprecated ? 'deprecated' : ''}`;
8383
return info;
8484
}
8585

@@ -415,11 +415,12 @@ export function schemaInObjectNotation(schema, obj, level = 0, suffix = '') {
415415
});
416416
obj = objWithAllProps;
417417
} else if (schema.anyOf || schema.oneOf) {
418-
obj['::description'] = schema.description ? schema.description : '';
418+
obj['::description'] = schema.description || '';
419419
// 1. First iterate the regular properties
420420
if (schema.type === 'object' || schema.properties) {
421-
obj['::description'] = schema.description ? schema.description : '';
421+
obj['::description'] = schema.description || '';
422422
obj['::type'] = 'object';
423+
// obj['::deprecated'] = schema.deprecated || false;
423424
for (const key in schema.properties) {
424425
if (schema.required && schema.required.includes(key)) {
425426
obj[`${key}*`] = schemaInObjectNotation(schema.properties[key], {}, (level + 1));
@@ -448,9 +449,11 @@ export function schemaInObjectNotation(schema, obj, level = 0, suffix = '') {
448449
});
449450
obj[(schema.anyOf ? `::ANY~OF ${suffix}` : `::ONE~OF ${suffix}`)] = objWithAnyOfProps;
450451
obj['::type'] = 'xxx-of';
452+
// obj['::deprecated'] = schema.deprecated || false;
451453
} else if (schema.type === 'object' || schema.properties) {
452-
obj['::description'] = schema.description ? schema.description : '';
454+
obj['::description'] = schema.description || '';
453455
obj['::type'] = 'object';
456+
obj['::deprecated'] = schema.deprecated || false;
454457
for (const key in schema.properties) {
455458
if (schema.required && schema.required.includes(key)) {
456459
obj[`${key}*`] = schemaInObjectNotation(schema.properties[key], {}, (level + 1));

0 commit comments

Comments
 (0)