[READ-ONLY] Mirror of https://github.com/FoxxMD/komodo-import. Import existing compose stacks into Komodo
foxxmd.github.io/komodo-import
compose
docker
import
komodo
toml
docs: Make masking more granular
* Mask sensitive user input using components and magic comments
* Remove blocking entire compose block
+27
-14
+8
-1
docsite/docusaurus.config.ts
+8
-1
docsite/docusaurus.config.ts
···
181
181
prism: {
182
182
theme: themes.themes.github,
183
183
darkTheme: themes.themes.dracula,
184
-
additionalLanguages: ['json','json5','typescript', 'docker', 'bash', 'ini','yaml']
184
+
additionalLanguages: ['json','json5','typescript', 'docker', 'bash', 'ini','yaml'],
185
+
magicComments: [
186
+
{
187
+
line: 'mask',
188
+
className: 'rr-mask',
189
+
block: {start: 'mask-start', end: 'mask-end'}
190
+
}
191
+
]
185
192
},
186
193
colorMode: {
187
194
defaultMode: 'dark',
+10
-5
docsite/src/components/LocalStorage/Text.tsx
+10
-5
docsite/src/components/LocalStorage/Text.tsx
···
10
10
initialValue?: string
11
11
placeholder?: string
12
12
stylePreset?: 'inline' | 'bold'
13
+
sensitive?: boolean
13
14
}
14
15
15
16
export type FixedStorageProps = Omit<LocalStorateTextProps, 'storageKey'>;
···
21
22
stylePreset,
22
23
placeholder,
23
24
storageKey,
24
-
initialValue = ""
25
+
initialValue = "",
26
+
sensitive = false
25
27
} = props
26
28
27
29
const [storageVal, setStorageVal] = useTypedLocalStorage(storageKey, initialValue);
···
40
42
setInputValue(storageVal);
41
43
}, [storageVal, setValue, setInputValue])
42
44
45
+
const sensitiveClass = sensitive ? 'rr-mask' : '';
46
+
43
47
if(readOnly) {
44
48
let roVal: string;
45
49
if(storageVal !== undefined && storageVal !== null && storageVal.trim() !== '') {
···
49
53
} else if(placeholder !== undefined) {
50
54
roVal = placeholder;
51
55
}
56
+
52
57
switch(stylePreset) {
53
58
case 'inline':
54
-
return <CodeInline>{roVal}</CodeInline>;
59
+
return <CodeInline className={sensitiveClass}>{roVal}</CodeInline>;
55
60
case 'bold':
56
-
return <strong>{roVal}</strong>;
61
+
return <strong className={sensitiveClass}>{roVal}</strong>;
57
62
default:
58
-
return <Fragment>{roVal}</Fragment>;
63
+
return <span className={sensitiveClass}>{roVal}</span>;
59
64
}
60
65
}
61
66
62
-
return <input type="text" placeholder={placeholder} onChange={handleInputChange} value={inputValue}/>
67
+
return <input type="text" className={sensitiveClass} placeholder={placeholder} onChange={handleInputChange} value={inputValue}/>
63
68
}
64
69
65
70
export const LocalStorageText: FC<LocalStorateTextProps> = (props) => {
+4
-4
docsite/src/components/LocalStorageComponents.tsx
+4
-4
docsite/src/components/LocalStorageComponents.tsx
···
8
8
...rest
9
9
} = props
10
10
11
-
return <LocalStorageText storageKey="serverName" placeholder={placeholder} {...rest}/>;
11
+
return <LocalStorageText storageKey="serverName" placeholder={placeholder} sensitive {...rest}/>;
12
12
}
13
13
14
14
export const HostDirectory: FC<FixedStorageProps> = (props) => {
···
28
28
...rest
29
29
} = props
30
30
31
-
return <LocalStorageText storageKey="komodoUrl" placeholder={placeholder} {...rest}/>;
31
+
return <LocalStorageText storageKey="komodoUrl" sensitive placeholder={placeholder} {...rest}/>;
32
32
}
33
33
34
34
export const KomodoApiKey: FC<FixedStorageProps> = (props) => {
···
38
38
...rest
39
39
} = props
40
40
41
-
return <LocalStorageText storageKey="komodoApiKey" placeholder={placeholder} {...rest}/>;
41
+
return <LocalStorageText storageKey="komodoApiKey" sensitive placeholder={placeholder} {...rest}/>;
42
42
}
43
43
44
44
export const KomodoApiSecret: FC<FixedStorageProps> = (props) => {
···
48
48
...rest
49
49
} = props
50
50
51
-
return <LocalStorageText storageKey="komodoApiSecret" placeholder={placeholder} {...rest}/>;
51
+
return <LocalStorageText storageKey="komodoApiSecret" sensitive placeholder={placeholder} {...rest}/>;
52
52
}
+4
-3
docsite/src/components/QuickStart/QSCompose.tsx
+4
-3
docsite/src/components/QuickStart/QSCompose.tsx
···
76
76
seq.add(stacksFromS);
77
77
78
78
const serverS = new Scalar(`SERVER_NAME=${serverValue !== undefined && serverValue.trim() !== '' ? serverValue : 'my-cool-server'}`);
79
-
serverS.commentBefore = '# Name of Server for this machine, in Komodo'
79
+
serverS.commentBefore = '# Name of Server for this machine, in Komodo\nmask'
80
80
seq.add(serverS);
81
81
82
82
if(storageSyncApiVal) {
83
83
const urlS = new Scalar(`KOMODO_URL=${komodoUrlValue === '' ? 'http://192.168.KOMOMDO.IP:8120' : komodoUrlValue}`);
84
84
urlS.spaceBefore = true;
85
-
urlS.commentBefore = '# Configuration for interacting with Komodo API';
85
+
urlS.commentBefore = '# Configuration for interacting with Komodo API\nmask-start';
86
86
seq.add(urlS);
87
87
seq.add(`API_KEY=${apiKeyValue === '' ? 'K-3A6btIPZYeBu_EXAMPLE_KEY' : apiKeyValue}`);
88
88
seq.add(`API_SECRET=${komodoSec === '' ? 'S-qnaXD1frutYlfC2ZYl_EXAMPLE_SECRET' : komodoSec}`);
89
89
const syncS = new Scalar('OUTPUT_API_SYNC=true');
90
+
syncS.commentBefore = 'mask-end';
90
91
syncS.comment = 'Create Sync Resource in Komodo'
91
92
seq.add(syncS);
92
93
}
···
119
120
120
121
}, [storageSyncApiVal, storageStacksFromVal, storageHostVal, serverValue, apiKeyValue, komodoSec, komodoUrlValue, setUserDoc]);
121
122
122
-
return <CodeBlock className="rr-block .rr-block" title="compose.yaml" language="yaml">{userDoc.toString()}</CodeBlock>;
123
+
return <CodeBlock title="compose.yaml" language="yaml">{userDoc.toString()}</CodeBlock>;
123
124
124
125
}
125
126
+1
-1
package.json
+1
-1
package.json
···
13
13
"build:parallel": "concurrently --kill-others-on-fail --names backend,frontend,docs \"npm run -s build:backend\" \"npm run -s build:frontend\" \"npm run docs:build\"",
14
14
"docs:install": "cd docsite && npm ci --no-audit",
15
15
"docs:start": "cd docsite && npm start",
16
-
"docs:build": "npm run schema && cd docsite && npm run build",
16
+
"docs:build": "cd docsite && npm run build",
17
17
"demo": "HOST_PARENT_PATH=/my/cool/path SERVER_NAME=my-cool-server FILES_ON_SERVER_DIR=tests/exampleDir tsx src/index.ts"
18
18
},
19
19
"engines": {