local-it/dashboard
Archived
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

comment out versions on code editor

Browse source 
remove configuration from install modal
This commit is contained in:
Davor 2022-08-05 19:57:07 +02:00
parent 198e926b4e
commit 94bd90486c
9 changed files with 84 additions and 104 deletions
Download patch file Download diff file Expand all files Collapse all files

107
src/modules/apps/components/AdvancedTab/AdvancedTab.tsx
View file

@ -1,20 +1,33 @@
import React, { Fragment } from 'react';
import React from 'react';
import _ from 'lodash';
import Editor from 'react-simple-code-editor';
import { Menu, Transition } from '@headlessui/react';
import { ChevronDownIcon } from '@heroicons/react/solid';
// import { Menu, Transition } from '@headlessui/react';
// import { ChevronDownIcon } from '@heroicons/react/solid';
import { highlight, languages } from 'prismjs';
import 'prismjs/components/prism-clike';
import 'prismjs/components/prism-yaml';
import 'prismjs/themes/prism.css';
import { showToast } from 'src/common/util/show-toast';
import { useApps } from 'src/services/apps';
import { initialEditorYaml } from '../../consts';
// import { Secrets } from './components';
function classNames(...classes: any) {
return classes.filter(Boolean).join(' ');
}
export const AdvancedTab = () => {
const [code, setCode] = React.useState(initialEditorYaml);
const { app, editApp } = useApps();
const resetCode = () => {
setCode(initialEditorYaml);
showToast('Code was reset.');
};
const vertifyCode = () => {
// call yaml verification (only format)
// const result = validateSchema(code, {});
};
const saveChanges = () => {
editApp({ ...app, configuration: code });
};
return (
<>
@ -22,41 +35,24 @@ export const AdvancedTab = () => {
<h1 className="text-2xl leading-6 font-medium text-gray-900">Configuration</h1>
</div>
<div className="grid grid-flow-col grid-cols-2 gap-8">
<div>
<div className="bg-gray-100 overflow-hidden rounded-lg">
<div className="px-4 h-16 sm:px-6 bg-gray-200 flex items-center">
<span className="text-gray-600 text-lg leading-6 font-medium">Current Configuration</span>
</div>
<div className="px-4 py-5 sm:p-6 overflow-x-auto">
<pre className="font-mono text-sm font-light">
{`luck: except
natural: still
near: though
search:
- feature
- - 1980732354.689713
- hour
- butter:
ordinary: 995901949.8974948
teeth: true
whole:
- -952367353
- - talk: -1773961379
temperature: false
oxygen: true
laugh:
flag:
in: 2144751662
hospital: -1544066384.1973226
law: congress
great: stomach`}
</pre>
</div>
<div className="bg-gray-100 overflow-hidden rounded-lg">
<div className="px-4 h-16 sm:px-6 bg-gray-200 flex items-center">
<span className="text-gray-600 text-lg leading-6 font-medium">Current Configuration</span>
</div>
<div className="px-4 py-5 sm:p-6 overflow-x-auto">
<Editor
value={initialEditorYaml}
onValueChange={_.noop}
highlight={(value) => highlight(value, languages.js, 'yaml')}
preClassName="font-mono text-sm font-light"
textareaClassName="font-mono overflow-auto font-light"
className="font-mono text-sm font-light"
disabled
/>
</div>
</div>
<div>
<div>
<div className="px-4 h-16 sm:px-6 bg-gray-200 flex justify-between items-center rounded-t-lg">
<div className="overflow-hidden rounded-lg">
{/* <div className="px-4 h-16 sm:px-6 bg-gray-200 flex justify-between items-center rounded-t-lg">
<span className="text-gray-600 text-lg leading-6 font-medium">Edit Configuration</span>
<Menu as="div" className="relative inline-block text-left">
@ -121,30 +117,34 @@ search:
</Menu.Items>
</Transition>
</Menu>
</div>
<div className="px-4 py-5 sm:p-6 border border-t-0 border-gray-200">
<Editor
value={code}
onValueChange={(value) => setCode(value)}
highlight={(value) => highlight(value, languages.js, 'yaml')}
preClassName="font-mono whitespace-normal font-light"
textareaClassName="font-mono overflow-auto font-light"
className="font-mono text-sm font-light"
/>
</div>
</div> */}
<div className="px-4 h-16 sm:px-6 bg-gray-200 flex items-center">
<span className="text-gray-600 text-lg leading-6 font-medium">Edit Configuration</span>
</div>
<div className="px-4 py-5 sm:p-6 border border-t-0 border-gray-200">
<Editor
value={code}
onValueChange={(value) => setCode(value)}
highlight={(value) => highlight(value, languages.js, 'yaml')}
preClassName="font-mono whitespace-normal font-light"
textareaClassName="font-mono overflow-auto font-light"
className="font-mono text-sm font-light"
/>
</div>
</div>
</div>
<div className="flex justify-end mt-10">
<button
type="button"
onClick={resetCode}
className="mr-3 inline-flex items-center px-4 py-2 border border-gray-200 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
>
Cancel
Reset
</button>
<button
type="button"
onClick={vertifyCode}
className="mr-3 inline-flex items-center px-4 py-2 shadow-sm text-sm font-medium rounded-md text-primary-700 bg-primary-100 hover:bg-primary-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
>
Verify
@ -152,6 +152,7 @@ search:
<button
type="button"
onClick={saveChanges}
className="inline-flex items-center px-4 py-2 shadow-sm text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
>
Save changes