diff --git a/.gitignore b/.gitignore index 095b8f392..934e75f19 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. +.idea /src/config/index.js # dependencies diff --git a/.idea/workspace.xml b/.idea/workspace.xml deleted file mode 100644 index 957ce7305..000000000 --- a/.idea/workspace.xml +++ /dev/null @@ -1,51 +0,0 @@ - - - - - - - - - - - - - - - - - - - 1698179374556 - - - - - - \ No newline at end of file diff --git a/src/assets/styles/components/_web-ide.scss b/src/assets/styles/components/_web-ide.scss index aad5e4b2e..4ca091ec3 100644 --- a/src/assets/styles/components/_web-ide.scss +++ b/src/assets/styles/components/_web-ide.scss @@ -90,21 +90,30 @@ color: white; .name-input { + .name-input-container { + input.invalid:focus { + border: 1px solid #ea4c89 !important; + outline-color: #ea4c89 !important; + } + } .validation-message { margin-top: 8px; + color: $color-danger; } & > input.invalid { - border: 1px solid red !important; - outline-color: 1px solid red !important; + border: 1px solid $color-danger !important; + outline-color: $color-danger !important; } + + .invalid-text { color: red !important; } .invalid-project-name { - color: purple; + color: $color-danger; } } @@ -117,7 +126,6 @@ .package-install-window { background: white; - } .editor.current-file-path { @@ -182,6 +190,26 @@ .light { + + .name-input { + + .validation-message { + color: $color-danger; + } + + .name-input-container { + input.invalid { + border: 1px solid $color-danger !important; + outline-color: $color-danger !important; + } + + .invalid-project-name { + color: $color-danger; + } + } + } + + .no-projects { color: rgb(105, 105, 105); } @@ -704,6 +732,19 @@ } .package-install-window { + + .install-package-button { + width: 105px; + display: inline-flex; + align-items: center; + justify-content: center; + + .install-package-status-icon { + } + } + &.github { + line-height:0.5em; + } display: flex; flex-direction: column; height: 100%; diff --git a/src/components/instance/functions/manage/index.js b/src/components/instance/functions/manage/index.js index 503658eb1..5c5ca5889 100644 --- a/src/components/instance/functions/manage/index.js +++ b/src/components/instance/functions/manage/index.js @@ -91,20 +91,6 @@ function ManageIndex({ refreshCustomFunctions, loading }) { } - - async function restartWithLoadingState({ auth: instanceAuth, url: instanceUrl }) { - - setRestartingInstance(true); - - setTimeout(async () => { - await restartInstance({ auth: instanceAuth, url: instanceUrl }); - setRestartingInstance(false); - }, 100); - - - } - - // save file to instance async function saveCodeToInstance(selectedFile, restartRequired) { @@ -328,7 +314,6 @@ function ManageIndex({ refreshCustomFunctions, loading }) { alert.error(message); } - // TODO: what do we actually want to do about an invalid package? // change to restartService({ auth, url, service: 'http_worker' }); await restartInstance({ auth: t.auth, url: t.instance.url }); diff --git a/src/components/shared/webide/Editor.js b/src/components/shared/webide/Editor.js index 07fa8f816..67a08411c 100644 --- a/src/components/shared/webide/Editor.js +++ b/src/components/shared/webide/Editor.js @@ -54,6 +54,7 @@ function Editor({ active, file, onChange, theme }) { theme={editorTheme} onChange={ onChange } options={{ + readOnly: file.readOnly, automaticLayout: true, minimap: { enabled: false diff --git a/src/components/shared/webide/FileBrowser.js b/src/components/shared/webide/FileBrowser.js index aa1b01baf..fb486da5a 100644 --- a/src/components/shared/webide/FileBrowser.js +++ b/src/components/shared/webide/FileBrowser.js @@ -38,7 +38,7 @@ function ProjectIcon() { return ; } -function FolderIcon({ isOpen, toggleClosed }) { +function FolderIcon({ toggleClosed }) { return ; } @@ -166,10 +166,6 @@ function Folder({ directoryEntry, userOnSelect, onFolderSelect, onDeployProject, const entries = [...(directoryEntry.entries || [])].sort(directorySortComparator); const fileExtension = parseFileExtension(directoryEntry.name); - if (directoryEntry.path.endsWith('asdf')) { - console.log('directoryEntry: ', directoryEntry.path); - console.log('open: ', open); - } let Icon; // top-level dir === package // FolderIcon/PackageIcon is func so we can give it open args now, but instantiate it later. diff --git a/src/components/shared/webide/index.js b/src/components/shared/webide/index.js index e2aae5e59..4ed5fb56a 100644 --- a/src/components/shared/webide/index.js +++ b/src/components/shared/webide/index.js @@ -64,7 +64,6 @@ function WebIDE({ const canDeleteFolder = Boolean(hasProjects && (selectedFolder || selectedPackage)); // can only delete a folder if a target folder is selected const canAddProjectFolder = Boolean(selectedFolder); // can only add a folder toa project if a target folder is selected - function updateActiveEditorWindow(to, from) { // TODO: figure out correct logic here. setActiveEditorWindow(to); diff --git a/src/components/shared/webide/windows/PackageInstallWindow.js b/src/components/shared/webide/windows/PackageInstallWindow.js index 67577fe59..714b66685 100644 --- a/src/components/shared/webide/windows/PackageInstallWindow.js +++ b/src/components/shared/webide/windows/PackageInstallWindow.js @@ -22,6 +22,7 @@ export default function PackageInstallWindow({ selectedPackage, onConfirm, onCan const [ projectNameIsValid, setProjectNameIsValid ] = useState(true); const [ packageSpec, setPackageSpec ] = useState(''); + const [ loading, setLoading ] = useState(false); // result: 'packageSpec' gets sent to harperdb and installed by npm @@ -50,7 +51,11 @@ export default function PackageInstallWindow({ selectedPackage, onConfirm, onCan useEffect(validateProjectName, [ projectName ]); return ( - +
Package Install
{ @@ -109,7 +114,6 @@ export default function PackageInstallWindow({ selectedPackage, onConfirm, onCan { packageType === 'npm' && { - await onConfirm(projectName, packageSpec, deployTargets); + setLoading(true); + + try { + await onConfirm(projectName, packageSpec, deployTargets); + } catch(e) { + setLoading(false); + } + + setLoading(false); + } } className={ - cn("get-package-button", { - 'btn-success': true - // 'loading': loadingTags + cn("install-package-button", { + 'btn-success': true, + 'loading': loading }) } disabled={ !isValidProjectName(projectName) || !packageSpec || !deployTargets.length }> - Deploy Package + { + loading ? : 'Install Package' + }