feat: add creating directory through context menu in navigation tree #958
Conversation
|
Press "Enter" does't confirm creating a directory. |
| </div> | ||
| <div>{`${parent}/`}</div> | ||
| </div> | ||
| <TextInput |
There was a problem hiding this comment.
Could you please clarify with Xeno if we need any validation here?
| const handleCreateDirectorySubmit = (child: string) => { | ||
| createDirectory({database: parent, path: `${parent}/${child}`}); | ||
|
|
||
| onActivePathUpdate(`${parent}/${child}`); |
There was a problem hiding this comment.
It seems we should do it after directory is created (wait for createDirectory answer).
|
|
||
| onActivePathUpdate(`${parent}/${child}`); | ||
|
|
||
| setCreateDirectoryOpen(false); |
There was a problem hiding this comment.
same here. I would set some loading state to dialog Apply buttons and close dialog on request success. If request fails we may show an error inside the dialog's body.
| @import '../../../../styles/mixins.scss'; | ||
|
|
||
| .ydb-schema-create-directory-dialog { | ||
| &__modal { |
There was a problem hiding this comment.
It seems this class is redundant.
|
One more - we should disable "Apply" button, if directory name is empty. |
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
| React.useEffect(() => { | ||
| if (createDirectoryResult.isError) { | ||
| const errorMessage = | ||
| (createDirectoryResult.error as {data: string})?.data || ' Unknown error'; |
There was a problem hiding this comment.
Does the error contain a message?
There was a problem hiding this comment.
The error contains only such fields
{
"data": "{ status: SCHEME_ERROR, issues: { <main>: Error: Check failed: path: '/local/.sys_health/±', error: symbol '?' is not allowed in the path part '±' } }",
"status": 400,
"statusText": "Bad Request",
"headers": {
"content-length": "140",
"content-type": "text/plain"
},
"config": {
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
},
"adapter": [
"xhr",
"http"
],
"transformRequest": [
null
],
"transformResponse": [
null
],
"timeout": 60000,
"xsrfCookieName": "",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"env": {},
"headers": {
"Accept": "application/json, text/plain, */*",
"Content-Type": "application/json"
},
"withCredentials": false,
"signal": {},
"method": "post",
"url": "http://localhost:8765/scheme/directory",
"data": "{}",
"params": {
"database": "/local/.sys_health",
"path": "/local/.sys_health/±"
},
"axios-retry": {
"retries": 3,
"shouldResetTimeout": false,
"validateResponse": null,
"retryCount": 0,
"lastRequestTime": 1719906437941
}
},
"request": {}
}
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
| <div className={b('description')}>{i18n('schema.tree.dialog.description')}</div> | ||
| <div>{`${parentPath}/`}</div> | ||
| </div> | ||
| <TextInput |
There was a problem hiding this comment.
Let's wrap it to form and call validation and mutation on submit.
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Outdated
Show resolved
Hide resolved
src/containers/Tenant/Schema/CreateDirectoryDialog/CreateDirectoryDialog.tsx
Show resolved
Hide resolved
| error={hasValidationError} | ||
| /> | ||
| <div className={b('error-wrapper')}> | ||
| {hasValidationError && <ResponseError error={validationError} />} |
There was a problem hiding this comment.
why is this not in the TextInput's errorMessage?
There was a problem hiding this comment.
To prevent dialog's height jumping.
| textButtonApply={i18n('schema.tree.dialog.buttonApply')} | ||
| textButtonCancel={i18n('schema.tree.dialog.buttonCancel')} | ||
| onClickButtonCancel={handleClose} | ||
| propsButtonApply={{disabled: hasValidationError, type: 'submit'}} |
There was a problem hiding this comment.
| propsButtonApply={{disabled: hasValidationError, type: 'submit'}} | |
| propsButtonApply={{type: 'submit'}} |
There was a problem hiding this comment.
You suggest not to disable Apply button at all? But why?
There was a problem hiding this comment.
Why do you want to disable it? There is a validation before submission.
There was a problem hiding this comment.
If it's validation error, we 100% know, that "Apply" won't work.
Or maybe I just like to forbid :)
| } | ||
|
|
||
| export function CreateDirectoryDialog({open, onClose, parentPath, onSuccess}: SchemaTreeProps) { | ||
| const [error, setError] = React.useState<unknown>(''); |
There was a problem hiding this comment.
Why is this needed? response contains error.
| autoFocus | ||
| hasClear | ||
| disabled={response.isLoading} | ||
| error={hasValidationError} |
| @@ -26,14 +28,14 @@ function validateRelativePath(value: string) { | |||
| } | |||
|
|
|||
| export function CreateDirectoryDialog({open, onClose, parentPath, onSuccess}: SchemaTreeProps) { | |||
| const [error, setError] = React.useState<unknown>(''); | |||
| const [showResponseError, setShowResponseError] = React.useState(false); | |||
There was a problem hiding this comment.
response has a reset method
| @@ -78,27 +79,29 @@ export function CreateDirectoryDialog({open, onClose, parentPath, onSuccess}: Sc | |||
| }} | |||
| > | |||
| <Dialog.Body> | |||
| <div className={b('label')}> | |||
| <div className={b('description')}> | |||
| <label htmlFor={relativePathInputName} className={b('label')}> | |||
There was a problem hiding this comment.
for attribute should be connected to an id of input not a name.
Raubzeug
force-pushed
the
feat/createDirectory-915
branch
from
90c6b6b to
064ac63
Compare
closes #915