adding file logic
This commit is contained in:
@ -6,11 +6,14 @@ import SidebarFolder from "./folder"
|
||||
import { TFile, TFolder, TTab } from "./types"
|
||||
import { useState } from "react"
|
||||
import New from "./new"
|
||||
import { Socket } from "socket.io-client"
|
||||
|
||||
export default function Sidebar({
|
||||
files,
|
||||
selectFile,
|
||||
handleRename,
|
||||
socket,
|
||||
addNew,
|
||||
}: {
|
||||
files: (TFile | TFolder)[]
|
||||
selectFile: (tab: TTab) => void
|
||||
@ -20,6 +23,8 @@ export default function Sidebar({
|
||||
oldName: string,
|
||||
type: "file" | "folder"
|
||||
) => boolean
|
||||
socket: Socket
|
||||
addNew: (name: string, type: "file" | "folder") => void
|
||||
}) {
|
||||
const [creatingNew, setCreatingNew] = useState<"file" | "folder" | null>(null)
|
||||
|
||||
@ -73,8 +78,13 @@ export default function Sidebar({
|
||||
)}
|
||||
{creatingNew !== null ? (
|
||||
<New
|
||||
socket={socket}
|
||||
type={creatingNew}
|
||||
stopEditing={() => setCreatingNew(null)}
|
||||
stopEditing={() => {
|
||||
console.log("stopped editing")
|
||||
setCreatingNew(null)
|
||||
}}
|
||||
addNew={addNew}
|
||||
/>
|
||||
) : null}
|
||||
</>
|
||||
|
@ -1,19 +1,33 @@
|
||||
"use client"
|
||||
|
||||
import { validateName } from "@/lib/utils"
|
||||
import Image from "next/image"
|
||||
import { useEffect, useRef } from "react"
|
||||
import { Socket } from "socket.io-client"
|
||||
|
||||
export default function New({
|
||||
socket,
|
||||
type,
|
||||
stopEditing,
|
||||
addNew,
|
||||
}: {
|
||||
socket: Socket
|
||||
type: "file" | "folder"
|
||||
stopEditing: () => void
|
||||
addNew: (name: string, type: "file" | "folder") => void
|
||||
}) {
|
||||
const inputRef = useRef<HTMLInputElement>(null)
|
||||
|
||||
const createFile = () => {
|
||||
console.log("Create File")
|
||||
const createNew = () => {
|
||||
const name = inputRef.current?.value
|
||||
// console.log("Create:", name, type)
|
||||
|
||||
if (name && validateName(name, "", type)) {
|
||||
if (type === "file") {
|
||||
socket.emit("createFile", name)
|
||||
}
|
||||
addNew(name, type)
|
||||
}
|
||||
stopEditing()
|
||||
}
|
||||
|
||||
@ -37,13 +51,13 @@ export default function New({
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault()
|
||||
createFile()
|
||||
createNew()
|
||||
}}
|
||||
>
|
||||
<input
|
||||
ref={inputRef}
|
||||
className={`bg-transparent transition-all focus-visible:outline-none focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:ring-2 focus-visible:ring-ring rounded-sm w-full`}
|
||||
onBlur={() => createFile()}
|
||||
onBlur={() => createNew()}
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user