ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

can sort projects #3362

Browse Source
This commit is contained in:
Kurt Hutten Irev-Dev
2024-08-14 15:34:52 +10:00
parent 52eb41c7c7
commit 26d1410588
2 changed files with 254 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
e2e/playwright/projects.spec.ts
View File

@ -6,6 +6,128 @@ test.afterEach(async ({ page }, testInfo) => {
await tearDown(page, testInfo)
})
test(
'Can sort projects on home page',
{ tag: '@electron' },
async ({ browserName }, testInfo) => {
test.skip(
browserName === 'webkit',
'Skip on Safari because `window.tearDown` does not work'
)
const { electronApp, page } = await setupElectron({
testInfo,
folderSetupFn: async (dir) => {
await fsp.mkdir(`${dir}/router-template-slate`, { recursive: true })
await fsp.copyFile(
'src/wasm-lib/tests/executor/inputs/router-template-slate.kcl',
`${dir}/router-template-slate/main.kcl`
)
// wait more than a second so the timestamp is different
await new Promise((r) => setTimeout(r, 1_200))
await fsp.mkdir(`${dir}/bracket`, { recursive: true })
await fsp.copyFile(
'src/wasm-lib/tests/executor/inputs/focusrite_scarlett_mounting_braket.kcl',
`${dir}/bracket/main.kcl`
)
// wait more than a second so the timestamp is different
await new Promise((r) => setTimeout(r, 1_200))
await fsp.mkdir(`${dir}/lego`, { recursive: true })
await fsp.copyFile(
'src/wasm-lib/tests/executor/inputs/lego.kcl',
`${dir}/lego/main.kcl`
)
},
})
await page.goto('http://localhost:3000/')
await page.setViewportSize({ width: 1200, height: 500 })
const getAllProjects = () => page.getByTestId('project-link').all()
page.on('console', console.log)
await test.step('should be shorted by modified initially', async () => {
const lastModifiedButton = page.getByRole('button', {
name: 'Last Modified',
})
await expect(lastModifiedButton).toBeVisible()
await expect(lastModifiedButton.getByLabel('arrow down')).toBeVisible()
})
const projectNamesOrderedByModified = [
'lego',
'bracket',
'router-template-slate',
]
await test.step('Check the order of the projects is correct', async () => {
for (const [index, projectLink] of (await getAllProjects()).entries()) {
await expect(projectLink).toContainText(
projectNamesOrderedByModified[index]
)
}
})
await test.step('Reverse modified order', async () => {
const lastModifiedButton = page.getByRole('button', {
name: 'Last Modified',
})
await lastModifiedButton.click()
await expect(lastModifiedButton).toBeVisible()
await expect(lastModifiedButton.getByLabel('arrow up')).toBeVisible()
})
await test.step('Check the order of the projects is has reversed', async () => {
for (const [index, projectLink] of (await getAllProjects()).entries()) {
await expect(projectLink).toContainText(
[...projectNamesOrderedByModified].reverse()[index]
)
}
})
await test.step('Change order to by name', async () => {
const nameButton = page.getByRole('button', {
name: 'Name',
})
await nameButton.click()
await expect(nameButton).toBeVisible()
await expect(nameButton.getByLabel('arrow down')).toBeVisible()
})
const projectNamesOrderedByName = [
'bracket',
'lego',
'router-template-slate',
]
await test.step('Check the order of the projects is by name', async () => {
for (const [index, projectLink] of (await getAllProjects()).entries()) {
await expect(projectLink).toContainText(
projectNamesOrderedByName[index]
)
}
})
await test.step('Reverse name order', async () => {
const nameButton = page.getByRole('button', {
name: 'Name',
})
await nameButton.click()
await expect(nameButton).toBeVisible()
await expect(nameButton.getByLabel('arrow up')).toBeVisible()
})
await test.step('Check the order of the projects is by name reversed', async () => {
for (const [index, projectLink] of (await getAllProjects()).entries()) {
await expect(projectLink).toContainText(
[...projectNamesOrderedByName].reverse()[index]
)
}
})
await electronApp.close()
}
)
test(
'When the project folder is empty, user can create new project and open it.',
{ tag: '@electron' },

154
src/components/CustomIcon.tsx
View File

@ -2,7 +2,12 @@ import { cloneElement } from 'react'
const CustomIconMap = {
arc: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arc"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -12,7 +17,12 @@ const CustomIconMap = {
</svg>
),
angle: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="angle"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -22,7 +32,12 @@ const CustomIconMap = {
</svg>
),
arrowDown: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arrow down"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -32,7 +47,12 @@ const CustomIconMap = {
</svg>
),
arrowLeft: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arrow left"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -42,7 +62,12 @@ const CustomIconMap = {
</svg>
),
arrowRight: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arrow right"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -52,7 +77,12 @@ const CustomIconMap = {
</svg>
),
arrowRotateRight: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arrow rotate right"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -62,7 +92,12 @@ const CustomIconMap = {
</svg>
),
arrowUp: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="arrow up"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -72,7 +107,12 @@ const CustomIconMap = {
</svg>
),
booleanExclude: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="boolean exclude"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -82,7 +122,12 @@ const CustomIconMap = {
</svg>
),
booleanIntersect: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="boolean intersect"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -92,7 +137,12 @@ const CustomIconMap = {
</svg>
),
booleanSubtract: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="boolean subtract"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -102,7 +152,12 @@ const CustomIconMap = {
</svg>
),
booleanUnion: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="boolean union"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -112,7 +167,12 @@ const CustomIconMap = {
</svg>
),
bug: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="bug"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -122,7 +182,12 @@ const CustomIconMap = {
</svg>
),
checkmark: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="checkmark"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -132,7 +197,12 @@ const CustomIconMap = {
</svg>
),
caretDown: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="caret down"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -142,7 +212,12 @@ const CustomIconMap = {
</svg>
),
chamfer3d: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="chamfer 3d"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -152,7 +227,12 @@ const CustomIconMap = {
</svg>
),
circle: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="circle"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -162,7 +242,12 @@ const CustomIconMap = {
</svg>
),
clipboardCheckmark: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="clipboard checkmark"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -172,7 +257,12 @@ const CustomIconMap = {
</svg>
),
clipboardPlus: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="clipboard plus"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -182,7 +272,12 @@ const CustomIconMap = {
</svg>
),
close: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="close"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -192,7 +287,12 @@ const CustomIconMap = {
</svg>
),
code: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="code"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -202,7 +302,12 @@ const CustomIconMap = {
</svg>
),
dimension: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="dimension"
>
<path
fillRule="evenodd"
clipRule="evenodd"
@ -354,7 +459,12 @@ const CustomIconMap = {
</svg>
),
horizontalDash: (
<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
aria-label="horizontal Dash"
>
<path
fillRule="evenodd"
clipRule="evenodd"