chore: first commit
This commit is contained in:
@@ -1,105 +1,125 @@
|
|||||||
import { mkdir, rename, rm } from "node:fs/promises"
|
/**
|
||||||
|
* FSD Component Generator - Flat Structure
|
||||||
|
*
|
||||||
|
* Creates components with flat structure:
|
||||||
|
* ComponentName/
|
||||||
|
* ├── index.ts
|
||||||
|
* ├── ComponentName.tsx
|
||||||
|
* ├── ComponentName.module.scss
|
||||||
|
* └── ComponentName.d.ts
|
||||||
|
*
|
||||||
|
* Usage: bun gc <layer> <ComponentName>
|
||||||
|
* Example: bun gc entity ProjectCard
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { mkdir, writeFile } from "node:fs/promises"
|
||||||
|
|
||||||
const segments = "ui,model,api"
|
|
||||||
const args = Bun.argv.slice(2)
|
const args = Bun.argv.slice(2)
|
||||||
|
|
||||||
function printUsageAndExit(): never {
|
function printUsageAndExit(): never {
|
||||||
console.error(
|
console.error("Error: Please provide <layer> and <ComponentName>")
|
||||||
"Ошибка: Необходимо указать <название слоя> и <название компонента>",
|
console.log("Usage: bun gc <layer> <ComponentName>")
|
||||||
)
|
console.log("Layers: shared, entity, feature, widget, page")
|
||||||
console.log("Пример: bun gc features MyButton")
|
console.log("Example: bun gc entity ProjectCard")
|
||||||
process.exit(1)
|
process.exit(1)
|
||||||
}
|
}
|
||||||
|
|
||||||
function runShell(command: string): void {
|
function getComponentPath(layer: string, component: string): string {
|
||||||
console.log(`Выполняется: ${command}`)
|
const base = "./src/"
|
||||||
|
|
||||||
const result = Bun.spawnSync({
|
switch (layer) {
|
||||||
cmd: ["sh", "-lc", command],
|
case "shared":
|
||||||
stdin: "inherit",
|
return `${base}shared/ui/${component}`
|
||||||
stdout: "inherit",
|
case "app":
|
||||||
stderr: "inherit",
|
return `${base}app/${component}`
|
||||||
})
|
case "entity":
|
||||||
|
case "entities":
|
||||||
if (result.exitCode !== 0) {
|
return `${base}entities/${component}`
|
||||||
const suffix = result.signalCode ? ` (signal ${result.signalCode})` : ""
|
case "feature":
|
||||||
throw new Error(`Команда завершилась с кодом ${result.exitCode}${suffix}`)
|
case "features":
|
||||||
|
return `${base}features/${component}`
|
||||||
|
case "widget":
|
||||||
|
case "widgets":
|
||||||
|
return `${base}widgets/${component}`
|
||||||
|
case "page":
|
||||||
|
case "pages":
|
||||||
|
return `${base}pages/${component}`
|
||||||
|
default:
|
||||||
|
return `${base}${layer}s/${component}`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function generateIndexTemplate(component: string): string {
|
||||||
|
return `export * from "./${component}"
|
||||||
|
`
|
||||||
|
}
|
||||||
|
|
||||||
|
function generateComponentTemplate(component: string): string {
|
||||||
|
return `import type { I${component}Props } from "./${component}.d"
|
||||||
|
import type { JSX } from "react"
|
||||||
|
|
||||||
|
import { FunctionComponent } from "react"
|
||||||
|
|
||||||
|
import styles from "./${component}.module.scss"
|
||||||
|
|
||||||
|
export const ${component}: FunctionComponent<I${component}Props> = (): JSX.Element => {
|
||||||
|
return (
|
||||||
|
<div className={styles.root} data-testid="${component}">
|
||||||
|
${component}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
|
||||||
|
function generateTypesTemplate(component: string): string {
|
||||||
|
return `export interface I${component}Props {
|
||||||
|
className?: string
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
|
||||||
|
function generateStylesTemplate(): string {
|
||||||
|
return `.root {
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
|
||||||
if (args.length < 2) {
|
if (args.length < 2) {
|
||||||
printUsageAndExit()
|
printUsageAndExit()
|
||||||
}
|
}
|
||||||
|
|
||||||
const layer = args[0]
|
const layer = args[0]
|
||||||
const component = args[1]
|
const component = args[1]
|
||||||
const otherArgs = args.slice(2).join(" ")
|
const componentPath = getComponentPath(layer, component)
|
||||||
|
|
||||||
let componentPath = "./src/"
|
console.log(`Creating ${component} in ${componentPath}...`)
|
||||||
|
|
||||||
if (layer === "shared") {
|
try {
|
||||||
componentPath += `${layer}/ui/${component}`
|
|
||||||
} else if (layer === "app") {
|
|
||||||
componentPath += `${layer}/${component}`
|
|
||||||
} else if (layer === "entity" || layer === "entities") {
|
|
||||||
componentPath += `entities/${component}`
|
|
||||||
} else {
|
|
||||||
componentPath += `${layer}s/${component}`
|
|
||||||
}
|
|
||||||
|
|
||||||
const fsdCommand = `fsd ${layer} ${component} ${otherArgs} --segments ${segments} -r src`
|
|
||||||
|
|
||||||
if (layer !== "shared") {
|
|
||||||
try {
|
|
||||||
runShell(fsdCommand)
|
|
||||||
} catch (error) {
|
|
||||||
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
|
||||||
process.exit(1)
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
await mkdir(componentPath, { recursive: true })
|
await mkdir(componentPath, { recursive: true })
|
||||||
console.log("Пропущен fsd для shared: создаем компонент вручную")
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(`Удаление индекс файла: ${componentPath}/index.ts`)
|
await Promise.all([
|
||||||
|
writeFile(`${componentPath}/index.ts`, generateIndexTemplate(component)),
|
||||||
|
writeFile(
|
||||||
|
`${componentPath}/${component}.tsx`,
|
||||||
|
generateComponentTemplate(component),
|
||||||
|
),
|
||||||
|
writeFile(
|
||||||
|
`${componentPath}/${component}.d.ts`,
|
||||||
|
generateTypesTemplate(component),
|
||||||
|
),
|
||||||
|
writeFile(
|
||||||
|
`${componentPath}/${component}.module.scss`,
|
||||||
|
generateStylesTemplate(),
|
||||||
|
),
|
||||||
|
])
|
||||||
|
|
||||||
try {
|
console.log(`✅ Created ${component}:`)
|
||||||
await rm(`${componentPath}/index.ts`, { force: true })
|
console.log(` ${componentPath}/index.ts`)
|
||||||
|
console.log(` ${componentPath}/${component}.tsx`)
|
||||||
|
console.log(` ${componentPath}/${component}.d.ts`)
|
||||||
|
console.log(` ${componentPath}/${component}.module.scss`)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
console.error(`Error: ${(error as Error).message}`)
|
||||||
process.exit(1)
|
|
||||||
}
|
|
||||||
|
|
||||||
const createTsx = `bunx generate-react-cli component ${component} --flat --path ${componentPath}`
|
|
||||||
|
|
||||||
try {
|
|
||||||
runShell(createTsx)
|
|
||||||
} catch (error) {
|
|
||||||
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
|
||||||
process.exit(1)
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log("Перемещение файлов...")
|
|
||||||
|
|
||||||
const oldPath = `${componentPath}/${component}`
|
|
||||||
const newPath = `${componentPath}`
|
|
||||||
|
|
||||||
try {
|
|
||||||
await mkdir(`${newPath}/ui`, { recursive: true })
|
|
||||||
await mkdir(`${newPath}/model`, { recursive: true })
|
|
||||||
|
|
||||||
await rename(`${oldPath}.tsx`, `${newPath}/ui/${component}.tsx`)
|
|
||||||
console.log("TSX файл перемещен")
|
|
||||||
|
|
||||||
await rename(
|
|
||||||
`${oldPath}.module.scss`,
|
|
||||||
`${newPath}/ui/${component}.module.scss`,
|
|
||||||
)
|
|
||||||
console.log("SCSS файл перемещен")
|
|
||||||
|
|
||||||
await rename(`${oldPath}.d.ts`, `${newPath}/model/${component}.d.ts`)
|
|
||||||
console.log("D.TS файл перемещен")
|
|
||||||
} catch (error) {
|
|
||||||
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
|
||||||
process.exit(1)
|
process.exit(1)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,105 @@
|
|||||||
|
import { mkdir, rename, rm } from "node:fs/promises"
|
||||||
|
|
||||||
|
const segments = "ui,model,api"
|
||||||
|
const args = Bun.argv.slice(2)
|
||||||
|
|
||||||
|
function printUsageAndExit(): never {
|
||||||
|
console.error(
|
||||||
|
"Ошибка: Необходимо указать <название слоя> и <название компонента>",
|
||||||
|
)
|
||||||
|
console.log("Пример: bun gc features MyButton")
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
function runShell(command: string): void {
|
||||||
|
console.log(`Выполняется: ${command}`)
|
||||||
|
|
||||||
|
const result = Bun.spawnSync({
|
||||||
|
cmd: ["sh", "-lc", command],
|
||||||
|
stdin: "inherit",
|
||||||
|
stdout: "inherit",
|
||||||
|
stderr: "inherit",
|
||||||
|
})
|
||||||
|
|
||||||
|
if (result.exitCode !== 0) {
|
||||||
|
const suffix = result.signalCode ? ` (signal ${result.signalCode})` : ""
|
||||||
|
throw new Error(`Команда завершилась с кодом ${result.exitCode}${suffix}`)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (args.length < 2) {
|
||||||
|
printUsageAndExit()
|
||||||
|
}
|
||||||
|
|
||||||
|
const layer = args[0]
|
||||||
|
const component = args[1]
|
||||||
|
const otherArgs = args.slice(2).join(" ")
|
||||||
|
|
||||||
|
let componentPath = "./src/"
|
||||||
|
|
||||||
|
if (layer === "shared") {
|
||||||
|
componentPath += `${layer}/ui/${component}`
|
||||||
|
} else if (layer === "app") {
|
||||||
|
componentPath += `${layer}/${component}`
|
||||||
|
} else if (layer === "entity" || layer === "entities") {
|
||||||
|
componentPath += `entities/${component}`
|
||||||
|
} else {
|
||||||
|
componentPath += `${layer}s/${component}`
|
||||||
|
}
|
||||||
|
|
||||||
|
const fsdCommand = `fsd ${layer} ${component} ${otherArgs} --segments ${segments} -r src`
|
||||||
|
|
||||||
|
if (layer !== "shared") {
|
||||||
|
try {
|
||||||
|
runShell(fsdCommand)
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
await mkdir(componentPath, { recursive: true })
|
||||||
|
console.log("Пропущен fsd для shared: создаем компонент вручную")
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(`Удаление индекс файла: ${componentPath}/index.ts`)
|
||||||
|
|
||||||
|
try {
|
||||||
|
await rm(`${componentPath}/index.ts`, { force: true })
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
const createTsx = `bunx generate-react-cli component ${component} --flat --path ${componentPath}`
|
||||||
|
|
||||||
|
try {
|
||||||
|
runShell(createTsx)
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log("Перемещение файлов...")
|
||||||
|
|
||||||
|
const oldPath = `${componentPath}/${component}`
|
||||||
|
const newPath = `${componentPath}`
|
||||||
|
|
||||||
|
try {
|
||||||
|
await mkdir(`${newPath}/ui`, { recursive: true })
|
||||||
|
await mkdir(`${newPath}/model`, { recursive: true })
|
||||||
|
|
||||||
|
await rename(`${oldPath}.tsx`, `${newPath}/ui/${component}.tsx`)
|
||||||
|
console.log("TSX файл перемещен")
|
||||||
|
|
||||||
|
await rename(
|
||||||
|
`${oldPath}.module.scss`,
|
||||||
|
`${newPath}/ui/${component}.module.scss`,
|
||||||
|
)
|
||||||
|
console.log("SCSS файл перемещен")
|
||||||
|
|
||||||
|
await rename(`${oldPath}.d.ts`, `${newPath}/model/${component}.d.ts`)
|
||||||
|
console.log("D.TS файл перемещен")
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`Ошибка выполнения команды: ${(error as Error).message}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
@@ -2,7 +2,7 @@ import type { JSX } from "react"
|
|||||||
|
|
||||||
import { FunctionComponent } from "react"
|
import { FunctionComponent } from "react"
|
||||||
|
|
||||||
import { ITemplateNameProps } from "../model/TemplateName.d"
|
import { ITemplateNameProps } from "./TemplateName.d"
|
||||||
import styles from "./TemplateName.module.scss"
|
import styles from "./TemplateName.module.scss"
|
||||||
|
|
||||||
export const TemplateName: FunctionComponent<
|
export const TemplateName: FunctionComponent<
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/TemplateName"
|
export * from "./TemplateName"
|
||||||
|
|||||||
@@ -74,27 +74,28 @@ src/
|
|||||||
|
|
||||||
## Component Structure
|
## Component Structure
|
||||||
|
|
||||||
Each component follows FSD slice structure:
|
Each component follows **flat FSD structure** (simplified for MVP):
|
||||||
|
|
||||||
```
|
```
|
||||||
ComponentName/
|
ComponentName/
|
||||||
├── index.ts # Public API (re-export)
|
├── index.ts # Public API (re-export)
|
||||||
├── ui/
|
├── ComponentName.tsx # Component + imports
|
||||||
│ ├── ComponentName.tsx
|
├── ComponentName.module.scss # Styles
|
||||||
│ └── ComponentName.module.scss
|
├── ComponentName.d.ts # Props interface
|
||||||
├── model/
|
└── useComponentApi.ts # Optional: hooks/API if needed
|
||||||
│ └── ComponentName.d.ts # Props interface
|
|
||||||
└── api/ # Optional: component-specific API
|
|
||||||
```
|
```
|
||||||
|
|
||||||
|
> **Note:** Old nested structure (`ui/`, `model/`, `api/` folders) has been deprecated.
|
||||||
|
> The backup of the old generator is at `.scripts/create-fsd-component.ts.bak`
|
||||||
|
|
||||||
### Component Template
|
### Component Template
|
||||||
|
|
||||||
```tsx
|
```tsx
|
||||||
|
import type { IComponentNameProps } from "./ComponentName.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { FunctionComponent } from "react"
|
import { FunctionComponent } from "react"
|
||||||
|
|
||||||
import { IComponentNameProps } from "../model/ComponentName.d"
|
|
||||||
import styles from "./ComponentName.module.scss"
|
import styles from "./ComponentName.module.scss"
|
||||||
|
|
||||||
export const ComponentName: FunctionComponent<
|
export const ComponentName: FunctionComponent<
|
||||||
@@ -108,6 +109,14 @@ export const ComponentName: FunctionComponent<
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
### Props Interface Template (ComponentName.d.ts)
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
export interface IComponentNameProps {
|
||||||
|
className?: string
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
### Generate Component
|
### Generate Component
|
||||||
|
|
||||||
Use one of these commands to generate new project-wide standardized component, don't create new component file by file by yourself
|
Use one of these commands to generate new project-wide standardized component, don't create new component file by file by yourself
|
||||||
@@ -166,6 +175,13 @@ export const Button: FC<IButtonProps> = ({ variant, onClick }): JSX.Element => {
|
|||||||
3. **No Cross-Slice Imports** — features cannot import from other features
|
3. **No Cross-Slice Imports** — features cannot import from other features
|
||||||
4. **Shared is Agnostic** — no business logic in shared layer
|
4. **Shared is Agnostic** — no business logic in shared layer
|
||||||
|
|
||||||
|
### When to Split Files
|
||||||
|
|
||||||
|
Split into separate files **only when**:
|
||||||
|
- Hook/API is reused by multiple components
|
||||||
|
- File exceeds ~200 lines
|
||||||
|
- Props interface is shared across 3+ components
|
||||||
|
|
||||||
### File Naming
|
### File Naming
|
||||||
|
|
||||||
| Type | Convention | Example |
|
| Type | Convention | Example |
|
||||||
|
|||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import { JSX } from "react"
|
||||||
|
|
||||||
|
import { ProjectWorkspacePage } from "@pages/ProjectWorkspacePage"
|
||||||
|
|
||||||
|
export default function Projects(): JSX.Element {
|
||||||
|
return (
|
||||||
|
<main>
|
||||||
|
<ProjectWorkspacePage />
|
||||||
|
</main>
|
||||||
|
)
|
||||||
|
}
|
||||||
+1
-1
@@ -6,7 +6,7 @@ import Drawer from "react-modern-drawer"
|
|||||||
import cs from "classnames"
|
import cs from "classnames"
|
||||||
import Link from "next/link"
|
import Link from "next/link"
|
||||||
|
|
||||||
import { INavigationDrawerProps } from "../model/NavigationDrawer.d"
|
import { INavigationDrawerProps } from "./NavigationDrawer.d"
|
||||||
import styles from "./NavigationDrawer.module.scss"
|
import styles from "./NavigationDrawer.module.scss"
|
||||||
|
|
||||||
import "react-modern-drawer/dist/index.css"
|
import "react-modern-drawer/dist/index.css"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/NavigationDrawer"
|
export * from "./NavigationDrawer"
|
||||||
|
|||||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IProjectCardProps } from "../model/ProjectCard.d"
|
import type { IProjectCardProps } from "./ProjectCard.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Image as ImageIcon, MoreHorizontal } from "lucide-react"
|
import { Image as ImageIcon, MoreHorizontal } from "lucide-react"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/ProjectCard"
|
export * from "./ProjectCard"
|
||||||
|
|||||||
Vendored
+2
-2
@@ -11,8 +11,8 @@ import {
|
|||||||
DropdownTrigger,
|
DropdownTrigger,
|
||||||
} from "@shared/ui/Dropdown"
|
} from "@shared/ui/Dropdown"
|
||||||
|
|
||||||
import { userDropdownValues } from "../model/constants"
|
import { userDropdownValues } from "./constants"
|
||||||
import { IUserDropdownProps } from "../model/UserDropdown.d"
|
import { IUserDropdownProps } from "./UserDropdown.d"
|
||||||
import styles from "./UserDropdown.module.scss"
|
import styles from "./UserDropdown.module.scss"
|
||||||
|
|
||||||
export const UserDropdown: FunctionComponent<IUserDropdownProps> = ({
|
export const UserDropdown: FunctionComponent<IUserDropdownProps> = ({
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/UserDropdown"
|
export * from "./UserDropdown"
|
||||||
|
|||||||
+3
-3
@@ -1,7 +1,7 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { ProjectCreateBody } from "../api/useCreateProject"
|
import type { ProjectCreateBody } from "./useCreateProject"
|
||||||
import type { ICreateProjectModalProps } from "../model/CreateProjectModal.d"
|
import type { ICreateProjectModalProps } from "./CreateProjectModal.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { FunctionComponent, useEffect } from "react"
|
import { FunctionComponent, useEffect } from "react"
|
||||||
@@ -9,7 +9,7 @@ import { Controller, useForm } from "react-hook-form"
|
|||||||
|
|
||||||
import { Button, Form, Modal, Select, SelectItem, TextField } from "@shared/ui"
|
import { Button, Form, Modal, Select, SelectItem, TextField } from "@shared/ui"
|
||||||
|
|
||||||
import { useCreateProject } from "../api/useCreateProject"
|
import { useCreateProject } from "./useCreateProject"
|
||||||
import styles from "./CreateProjectModal.module.scss"
|
import styles from "./CreateProjectModal.module.scss"
|
||||||
|
|
||||||
type ProjectStatus = ProjectCreateBody["status"]
|
type ProjectStatus = ProjectCreateBody["status"]
|
||||||
@@ -1,3 +1,3 @@
|
|||||||
export { CreateProjectModal } from "./ui/CreateProjectModal"
|
export { CreateProjectModal } from "./CreateProjectModal"
|
||||||
|
|
||||||
export type { ICreateProjectModalProps } from "./model/CreateProjectModal.d"
|
export type { ICreateProjectModalProps } from "./CreateProjectModal.d"
|
||||||
|
|||||||
@@ -1,3 +1,3 @@
|
|||||||
import HomePage from "./ui/HomePage"
|
import HomePage from "./HomePage"
|
||||||
|
|
||||||
export { HomePage }
|
export { HomePage }
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ import {
|
|||||||
} from "@shared/lib/constants"
|
} from "@shared/lib/constants"
|
||||||
import { Button, Form, TextField } from "@shared/ui"
|
import { Button, Form, TextField } from "@shared/ui"
|
||||||
|
|
||||||
import { ILoginPageProps } from "../model/LoginPage.d"
|
import { ILoginPageProps } from "./LoginPage.d"
|
||||||
import styles from "./LoginPage.module.scss"
|
import styles from "./LoginPage.module.scss"
|
||||||
|
|
||||||
interface ILoginFormData {
|
interface ILoginFormData {
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/LoginPage"
|
export * from "./LoginPage"
|
||||||
|
|||||||
@@ -0,0 +1,3 @@
|
|||||||
|
export interface IProjectWorkspacePageProps {
|
||||||
|
message?: string
|
||||||
|
}
|
||||||
@@ -0,0 +1,2 @@
|
|||||||
|
.root {
|
||||||
|
}
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import type { JSX } from "react"
|
||||||
|
|
||||||
|
import { FunctionComponent } from "react"
|
||||||
|
|
||||||
|
import { IProjectWorkspacePageProps } from "./ProjectWorkspacePage.d"
|
||||||
|
import styles from "./ProjectWorkspacePage.module.scss"
|
||||||
|
|
||||||
|
export const ProjectWorkspacePage: FunctionComponent<
|
||||||
|
IProjectWorkspacePageProps
|
||||||
|
> = (): JSX.Element => {
|
||||||
|
return (
|
||||||
|
<div className={styles.root} data-testid="ProjectWorkspacePage">
|
||||||
|
ProjectWorkspacePage Component
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from "./ProjectWorkspacePage"
|
||||||
+5
-2
@@ -10,14 +10,16 @@ import { CreateProjectModal } from "@features/CreateProjectModal"
|
|||||||
import api from "@shared/api"
|
import api from "@shared/api"
|
||||||
import { Button } from "@shared/ui"
|
import { Button } from "@shared/ui"
|
||||||
import { StaticLoader } from "@shared/ui/Loader"
|
import { StaticLoader } from "@shared/ui/Loader"
|
||||||
import { ProjectsHeader } from "@widgets/Projects/ProjectsHeader/ui/ProjectsHeader"
|
import { ProjectsHeader } from "@widgets/Projects/ProjectsHeader"
|
||||||
|
|
||||||
import { IProjectsPageProps } from "../model/ProjectsPage.d"
|
import { IProjectsPageProps } from "./ProjectsPage.d"
|
||||||
import styles from "./ProjectsPage.module.scss"
|
import styles from "./ProjectsPage.module.scss"
|
||||||
|
import { useRouter } from "next/navigation"
|
||||||
|
|
||||||
export const ProjectsPage: FunctionComponent<
|
export const ProjectsPage: FunctionComponent<
|
||||||
IProjectsPageProps
|
IProjectsPageProps
|
||||||
> = (): JSX.Element => {
|
> = (): JSX.Element => {
|
||||||
|
const router = useRouter();
|
||||||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)
|
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)
|
||||||
|
|
||||||
const {
|
const {
|
||||||
@@ -67,6 +69,7 @@ export const ProjectsPage: FunctionComponent<
|
|||||||
currentAction={
|
currentAction={
|
||||||
project.status === "PROCESSING" ? "Rendering" : undefined
|
project.status === "PROCESSING" ? "Rendering" : undefined
|
||||||
}
|
}
|
||||||
|
onClick={() => router.push(`/projects/${project.id}`)}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/ProjectsPage"
|
export * from "./ProjectsPage"
|
||||||
|
|||||||
+1
-1
@@ -10,7 +10,7 @@ import { useHookFormMask } from "use-mask-input"
|
|||||||
import api from "@shared/api"
|
import api from "@shared/api"
|
||||||
import { Button, Form, TextField } from "@shared/ui"
|
import { Button, Form, TextField } from "@shared/ui"
|
||||||
|
|
||||||
import { IRegisterPageProps } from "../model/RegisterPage.d"
|
import { IRegisterPageProps } from "./RegisterPage.d"
|
||||||
import styles from "./RegisterPage.module.scss"
|
import styles from "./RegisterPage.module.scss"
|
||||||
|
|
||||||
interface IRegisterFormData {
|
interface IRegisterFormData {
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/RegisterPage"
|
export * from "./RegisterPage"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IAlertProps } from "../model/Alert.d"
|
import type { IAlertProps } from "./Alert.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Callout } from "@radix-ui/themes"
|
import { Callout } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Alert"
|
export * from "./Alert"
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import cs from "classnames"
|
|||||||
import Image from "next/image"
|
import Image from "next/image"
|
||||||
import avatarPlaceholder from "@shared/assets/placeholder.png"
|
import avatarPlaceholder from "@shared/assets/placeholder.png"
|
||||||
|
|
||||||
import { IAvatarProps } from "../model/Avatar"
|
import { IAvatarProps } from "./Avatar.d"
|
||||||
import styles from "./Avatar.module.scss"
|
import styles from "./Avatar.module.scss"
|
||||||
|
|
||||||
const avatarProperties = {
|
const avatarProperties = {
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Avatar"
|
export * from "./Avatar"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IBadgeProps } from "../model/Badge.d"
|
import type { IBadgeProps } from "./Badge.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Badge as RadixBadge } from "@radix-ui/themes"
|
import { Badge as RadixBadge } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Badge"
|
export * from "./Badge"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IButtonProps } from "../model/Button.d"
|
import type { IButtonProps } from "./Button.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { forwardRef } from "react"
|
import { forwardRef } from "react"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Button"
|
export * from "./Button"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { ICardProps } from "../model/Card.d"
|
import type { ICardProps } from "./Card.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Card as RadixCard } from "@radix-ui/themes"
|
import { Card as RadixCard } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Card"
|
export * from "./Card"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { ICheckboxProps } from "../model/Checkbox.d"
|
import type { ICheckboxProps } from "./Checkbox.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Checkbox as RadixCheckbox, Flex, Text } from "@radix-ui/themes"
|
import { Checkbox as RadixCheckbox, Flex, Text } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Checkbox"
|
export * from "./Checkbox"
|
||||||
|
|||||||
+1
-1
@@ -1,4 +1,4 @@
|
|||||||
import type { ICircularProgressProps } from "../model/CircularProgress.d"
|
import type { ICircularProgressProps } from "./CircularProgress.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { FunctionComponent } from "react"
|
import { FunctionComponent } from "react"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/CircularProgress"
|
export * from "./CircularProgress"
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ import type {
|
|||||||
IDropdownSubProps,
|
IDropdownSubProps,
|
||||||
IDropdownSubTriggerProps,
|
IDropdownSubTriggerProps,
|
||||||
IDropdownTriggerProps,
|
IDropdownTriggerProps,
|
||||||
} from "../model/Dropdown.d"
|
} from "./Dropdown.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import * as DropdownMenu from "@radix-ui/react-dropdown-menu"
|
import * as DropdownMenu from "@radix-ui/react-dropdown-menu"
|
||||||
@@ -11,7 +11,7 @@ export {
|
|||||||
DropdownSubContent,
|
DropdownSubContent,
|
||||||
DropdownSubTrigger,
|
DropdownSubTrigger,
|
||||||
DropdownTrigger,
|
DropdownTrigger,
|
||||||
} from "./ui/Dropdown"
|
} from "./Dropdown"
|
||||||
|
|
||||||
export type {
|
export type {
|
||||||
IDropdownCheckboxItemProps,
|
IDropdownCheckboxItemProps,
|
||||||
@@ -26,4 +26,4 @@ export type {
|
|||||||
IDropdownSubProps,
|
IDropdownSubProps,
|
||||||
IDropdownSubTriggerProps,
|
IDropdownSubTriggerProps,
|
||||||
IDropdownTriggerProps,
|
IDropdownTriggerProps,
|
||||||
} from "./model/Dropdown.d"
|
} from "./Dropdown.d"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IFormProps } from "../model/Form.d"
|
import type { IFormProps } from "./Form.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { forwardRef } from "react"
|
import { forwardRef } from "react"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Form"
|
export * from "./Form"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IModalProps } from "../model/Modal.d"
|
import type { IModalProps } from "./Modal.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Dialog } from "@radix-ui/themes"
|
import { Dialog } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Modal"
|
export * from "./Modal"
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IPaginationProps } from "../model/Pagination.d"
|
import type { IPaginationProps } from "./Pagination.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Flex, IconButton, Text } from "@radix-ui/themes"
|
import { Flex, IconButton, Text } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Pagination"
|
export * from "./Pagination"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { IRadioGroupProps, IRadioProps } from "../model/Radio.d"
|
import type { IRadioGroupProps, IRadioProps } from "./Radio.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Flex, RadioGroup, Text } from "@radix-ui/themes"
|
import { Flex, RadioGroup, Text } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Radio"
|
export * from "./Radio"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { ISelectItemProps, ISelectProps } from "../model/Select.d"
|
import type { ISelectItemProps, ISelectProps } from "./Select.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Select as RadixSelect } from "@radix-ui/themes"
|
import { Select as RadixSelect } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Select"
|
export * from "./Select"
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import type { ITableProps } from "../model/Table.d"
|
import type { ITableProps } from "./Table.d"
|
||||||
import type { JSX } from "react"
|
import type { JSX } from "react"
|
||||||
|
|
||||||
import { Table as RadixTable } from "@radix-ui/themes"
|
import { Table as RadixTable } from "@radix-ui/themes"
|
||||||
@@ -1 +1 @@
|
|||||||
export * from "./ui/Table"
|
export * from "./Table"
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user