Skip to content

Commit 0d5bcdb

Browse files
BrunoQuaresmaBrunoQuaresma
committed
fix(site): Fix template version editor rename
1 parent 7a864bd commit 0d5bcdb

File tree

8 files changed

+87
-37
lines changed

8 files changed

+87
-37
lines changed

‎site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.tsx

+4
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,10 @@ const useStyles = makeStyles((theme) => ({
8888
},
8989

9090
"& p": {
91+
margin: 0,
92+
},
93+
94+
"& > p": {
9195
margin: theme.spacing(1, 0),
9296
},
9397
},

‎site/src/components/TemplateVersionEditor/FileDialog.tsx

+19-12
Original file line numberDiff line numberDiff line change
@@ -42,10 +42,10 @@ export const CreateFileDialog: FC<{
4242
confirmText="Create"
4343
title="Create File"
4444
description={
45-
<Stack spacing={1}>
45+
<Stack>
4646
<Typography>
4747
Specify the path to a file to be created. This path can contain
48-
slashes too!
48+
slashes too.
4949
</Typography>
5050
<TextField
5151
autoFocus
@@ -58,10 +58,13 @@ export const CreateFileDialog: FC<{
5858
name="file-path"
5959
autoComplete="off"
6060
id="file-path"
61-
placeholder="main.tf"
61+
placeholder="example.tf"
6262
value={pathValue}
6363
onChange={handleChange}
6464
label="File Path"
65+
InputLabelProps={{
66+
shrink: true,
67+
}}
6568
/>
6669
</Stack>
6770
}
@@ -82,7 +85,12 @@ export const DeleteFileDialog: FC<{
8285
open={open}
8386
onConfirm={onConfirm}
8487
title="Delete File"
85-
description={`Are you sure you want to delete "${filename}"?`}
88+
description={
89+
<>
90+
Are you sure you want to delete <strong>{filename}</strong>? It will
91+
be deleted permanently.
92+
</>
93+
}
8694
/>
8795
)
8896
}
@@ -123,14 +131,14 @@ export const RenameFileDialog: FC<{
123131
hideCancel={false}
124132
type="success"
125133
cancelText="Cancel"
126-
confirmText="Create"
134+
confirmText="Rename"
127135
title="Rename File"
128136
description={
129-
<Stack spacing={1}>
130-
<Typography>
131-
Rename {`"${filename}"`} to something else. This path can contain
132-
slashes too!
133-
</Typography>
137+
<Stack>
138+
<p>
139+
Rename <strong>{filename}</strong> to something else. This path can
140+
contain slashes too!
141+
</p>
134142
<TextField
135143
autoFocus
136144
onKeyDown={(event) => {
@@ -142,8 +150,7 @@ export const RenameFileDialog: FC<{
142150
name="file-path"
143151
autoComplete="off"
144152
id="file-path"
145-
placeholder="main.tf"
146-
defaultValue={filename}
153+
placeholder={filename}
147154
value={pathValue}
148155
onChange={handleChange}
149156
label="File Path"

‎site/src/components/TemplateVersionEditor/FileTreeView.tsx

+4-3
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,8 @@ export const FileTreeView: FC<{
6666
onSelect(currentPath)
6767
}}
6868
onContextMenu={(event) => {
69-
event.preventDefault()
69+
event.preventDefault() // Avoid default browser behavior
70+
event.stopPropagation() // Avoid trigger parent context menu
7071
setContextMenu(
7172
contextMenu
7273
? undefined
@@ -137,7 +138,7 @@ export const FileTreeView: FC<{
137138
setContextMenu(undefined)
138139
}}
139140
>
140-
Rename...
141+
Rename
141142
</MenuItem>
142143
<MenuItem
143144
onClick={() => {
@@ -148,7 +149,7 @@ export const FileTreeView: FC<{
148149
setContextMenu(undefined)
149150
}}
150151
>
151-
Delete Permanently
152+
Delete
152153
</MenuItem>
153154
</Menu>
154155
</TreeView>

‎site/src/components/TemplateVersionEditor/TemplateVersionEditor.tsx

+4-9
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
FileTree,
2323
getFileContent,
2424
isFolder,
25+
moveFile,
2526
removeFile,
2627
setFile,
2728
traverse,
@@ -266,15 +267,9 @@ export const TemplateVersionEditor: FC<TemplateVersionEditorProps> = ({
266267
if (!renameFileOpen) {
267268
return
268269
}
269-
setFileTree((fileTree) => {
270-
fileTree = setFile(
271-
newPath,
272-
getFileContent(renameFileOpen, fileTree) as string,
273-
fileTree,
274-
)
275-
fileTree = removeFile(renameFileOpen, fileTree)
276-
return fileTree
277-
})
270+
setFileTree((fileTree) =>
271+
moveFile(renameFileOpen, newPath, fileTree),
272+
)
278273
setActivePath(newPath)
279274
setRenameFileOpen(undefined)
280275
setDirty(true)

‎site/src/components/WorkspaceSchedule/WorkspaceSchedule.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export const WorkspaceSchedule: FC<
4646

4747
return (
4848
<div className={styles.schedule}>
49-
<Stack spacing={2}>
49+
<Stack>
5050
<div>
5151
<span className={styles.scheduleLabel}>{Language.timezoneLabel}</span>
5252
<span className={styles.scheduleValue}>{timezone}</span>

‎site/src/pages/WorkspaceChangeVersionPage/WorkspaceChangeVersionForm.tsx

+1-6
Original file line numberDiff line numberDiff line change
@@ -39,12 +39,7 @@ export const WorkspaceChangeVersionForm: FC<{
3939
return (
4040
<form onSubmit={formik.handleSubmit}>
4141
<Stack direction="column" spacing={3}>
42-
<Stack
43-
direction="row"
44-
spacing={2}
45-
className={styles.workspace}
46-
alignItems="center"
47-
>
42+
<Stack direction="row" className={styles.workspace} alignItems="center">
4843
<div className={styles.workspaceIcon}>
4944
<img src={workspace.template_icon} alt="" />
5045
</div>

‎site/src/util/filetree.test.ts

+38-3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {
33
FileTree,
44
getFileContent,
55
isFolder,
6+
moveFile,
67
removeFile,
78
setFile,
89
traverse,
@@ -32,10 +33,44 @@ test("getFileContent() return the file content from the file tree", () => {
3233
test("removeFile() removes a file from the file tree", () => {
3334
let fileTree: FileTree = {
3435
"main.tf": "terraform content",
35-
images: { "java.Dockerfile": "java dockerfile" },
36+
images: {
37+
"java.Dockerfile": "java dockerfile",
38+
"python.Dockerfile": "python Dockerfile",
39+
},
40+
}
41+
fileTree = removeFile("images/python.Dockerfile", fileTree)
42+
const expectedFileTree = {
43+
"main.tf": "terraform content",
44+
images: {
45+
"java.Dockerfile": "java dockerfile",
46+
},
47+
}
48+
expect(expectedFileTree).toEqual(fileTree)
49+
})
50+
51+
test("moveFile() moves a file from in file tree", () => {
52+
let fileTree: FileTree = {
53+
"main.tf": "terraform content",
54+
images: {
55+
"java.Dockerfile": "java dockerfile",
56+
"python.Dockerfile": "python Dockerfile",
57+
},
58+
}
59+
fileTree = moveFile(
60+
"images/java.Dockerfile",
61+
"other/java.Dockerfile",
62+
fileTree,
63+
)
64+
const expectedFileTree = {
65+
"main.tf": "terraform content",
66+
images: {
67+
"python.Dockerfile": "python Dockerfile",
68+
},
69+
other: {
70+
"java.Dockerfile": "java dockerfile",
71+
},
3672
}
37-
fileTree = removeFile("images", fileTree)
38-
expect(fileTree.images).toBeUndefined()
73+
expect(fileTree).toEqual(expectedFileTree)
3974
})
4075

4176
test("existsFile() returns if there is or not a file", () => {

‎site/src/util/filetree.ts

+16-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import set from "lodash/set"
22
import has from "lodash/has"
3-
import omit from "lodash/omit"
3+
import unset from "lodash/unset"
44
import get from "lodash/get"
55

66
export type FileTree = {
@@ -9,7 +9,7 @@ export type FileTree = {
99

1010
export const setFile = (
1111
path: string,
12-
content: string,
12+
content: FileTree | string,
1313
fileTree: FileTree,
1414
): FileTree => {
1515
return set(fileTree, path.split("/"), content)
@@ -20,7 +20,20 @@ export const existsFile = (path: string, fileTree: FileTree) => {
2020
}
2121

2222
export const removeFile = (path: string, fileTree: FileTree) => {
23-
return omit(fileTree, path.split("/"))
23+
const updatedFileTree = { ...fileTree }
24+
unset(fileTree, path.split("/"))
25+
return updatedFileTree
26+
}
27+
28+
export const moveFile = (
29+
currentPath: string,
30+
newPath: string,
31+
fileTree: FileTree,
32+
) => {
33+
const content = getFileContent(currentPath, fileTree)
34+
fileTree = removeFile(currentPath, fileTree)
35+
fileTree = setFile(newPath, content, fileTree)
36+
return fileTree
2437
}
2538

2639
export const getFileContent = (path: string, fileTree: FileTree) => {

0 commit comments

Comments
 (0)