ysandler/textualize
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

some ux and naming cleanup

Browse Source
This commit is contained in:
Joshua Shoemaker 2022-12-13 18:24:50 -06:00
parent acf93695d3
commit 9ced4f6f29
7 changed files with 55 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
build/bin/textualize.app/Contents/MacOS/Textualize Executable file
View File

Binary file not shown.

13
frontend/app/layout.tsx
View File

@ -8,15 +8,16 @@ type AppLayoutProps = {
children: React.ReactNode children: React.ReactNode
} }
const initialProjectProps = {
id: '',
documents: [] as ipc.Document[],
groups: [] as ipc.Group[]
}
export default function MainAppLayout({ children }: AppLayoutProps) { export default function MainAppLayout({ children }: AppLayoutProps) {
return <html className='bg-gray-100 bg-opacity-0'> return <html className='bg-gray-100 bg-opacity-0'>
<body className='min-h-screen' > <body className='min-h-screen' >
<ProjectProvider <ProjectProvider projectProps={initialProjectProps}>
projectProps={{
id: '',
documents: [] as ipc.Document[],
groups: [] as ipc.Group[]
}}>
{children} {children}
</ProjectProvider> </ProjectProvider>
</body> </body>

20
frontend/app/page.tsx
View File

@ -1,6 +1,6 @@
import 'server-only' import 'server-only'
import MainHead from '../components/MainHead' import MainHead from '../components/MainHead'
import DocumentRenderer from '../components/workspace/DocumentRenderer' import MainWorkspace from '../components/workspace/Main'
import Navigation from '../components/workspace/Navigation' import Navigation from '../components/workspace/Navigation'
export default function Home() { export default function Home() {
@ -8,23 +8,7 @@ export default function Home() {
<> <>
<MainHead /> <MainHead />
<Navigation /> <Navigation />
<MainWorkspace />
<main className=" bg-gray-100 h-[calc(100vh-4rem)] ml-64 ">
<div className='flex-1'>
<div className="py-6">
<div className="mx-auto px-4 sm:px-6 md:px-8">
<h1 className="text-2xl font-semibold text-gray-900">Dashboard</h1>
</div>
<div className="mx-auto px-4 sm:px-6 md:px-8">
<div className="py-4">
<div className=" min-h-96 rounded-lg border-4 border-dashed border-gray-200">
<DocumentRenderer />
</div>
</div>
</div>
</div>
</div>
</main>
</> </>
) )
} }

2
frontend/components/workspace/DocumentRenderer.tsx
View File

@ -27,7 +27,7 @@ const DocumentRenderer = () => {
const context = canvas.getContext('2d') const context = canvas.getContext('2d')
if (!context) return if (!context) return
context.drawImage(image, 10, 10, image.width, image.height) context.drawImage(image, 0, 0, image.width, image.height)
} }
useEffect(() => { useEffect(() => {

29
frontend/components/workspace/Main.tsx Normal file
View File

@ -0,0 +1,29 @@
'use client'
import { useProject } from "../../context/Project/provider"
import DocumentRenderer from "./DocumentRenderer"
const MainWorkspace = () => {
const { getSelectedDocument } = useProject()
return <main className=" bg-gray-100 min-h-[calc(100vh-4rem)] ml-64 ">
<div className='flex-1'>
<div className="py-6">
<div className="mx-auto px-4 sm:px-6 md:px-8">
<h1 className="text-2xl font-semibold text-gray-900">
{ getSelectedDocument()?.name }
</h1>
</div>
<div className="mx-auto px-4 sm:px-6 md:px-8">
<div className="py-4">
<div className=" min-h-96 border-4 border-dashed border-gray-200">
<DocumentRenderer />
</div>
</div>
</div>
</div>
</div>
</main>
}
export default MainWorkspace

17
frontend/components/workspace/Sidebar.tsx
View File

@ -102,10 +102,7 @@ function Sidebar() {
const response = await requestAddDocument(groupId, documentName) const response = await requestAddDocument(groupId, documentName)
if (!response.id) return if (!response.id) return
setSelectedDocumentId(response.id) setSelectedDocumentId(response.id)
setSelectedGroupId(groupId) setSelectedGroupId(groupId)
setIsAddNewDocumentInputShowing(false) setIsAddNewDocumentInputShowing(false)
} }
@ -121,6 +118,10 @@ function Sidebar() {
setIsAddNewGroupInputShowing(false) setIsAddNewGroupInputShowing(false)
} }
const onEnterHandler = (event: React.KeyboardEvent<HTMLInputElement>, callback: Function) => {
if (event.key === 'Enter') callback()
}
const renderAddGroupInput = () => { const renderAddGroupInput = () => {
return isAddNewGroupInputShowing return isAddNewGroupInputShowing
? <div className="mt-1 flex rounded-md shadow-sm"> ? <div className="mt-1 flex rounded-md shadow-sm">
@ -129,8 +130,13 @@ function Sidebar() {
type="text" type="text"
name="groupName" name="groupName"
id="groupName" id="groupName"
autoFocus
className="text-white placeholder-gray-400 bg-gray-900 bg-opacity-5 block w-full rounded-none rounded-l-md border-late-700 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm" className="text-white placeholder-gray-400 bg-gray-900 bg-opacity-5 block w-full rounded-none rounded-l-md border-late-700 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
placeholder="Add Group" placeholder="Add Group"
onKeyDown={(event) => {
onEnterHandler(event,
onConfirmAddGroupClickHandler)
}}
ref={addGroupTextInput} ref={addGroupTextInput}
/> />
</div> </div>
@ -174,6 +180,11 @@ function Sidebar() {
id="documentName" id="documentName"
className="text-white placeholder-gray-400 bg-gray-900 bg-opacity-5 block w-full rounded-none rounded-l-md border-late-700 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm" className="text-white placeholder-gray-400 bg-gray-900 bg-opacity-5 block w-full rounded-none rounded-l-md border-late-700 focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
placeholder="Add Document" placeholder="Add Document"
autoFocus
onKeyDown={(event) => {
onEnterHandler(event,
() => onConfirmAddDocumentClickHandler(groupId))
}}
ref={addDocumentTextInput} ref={addDocumentTextInput}
/> />
</div> </div>

4
main.go
View File

@ -9,7 +9,7 @@ import (
app "textualize/core/App" app "textualize/core/App"
document "textualize/core/Document" document "textualize/core/Document"
Channel "textualize/ipc" ipc "textualize/ipc"
"github.com/wailsapp/wails/v2" "github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/logger" "github.com/wailsapp/wails/v2/pkg/logger"
@ -50,7 +50,7 @@ func main() {
app := app.GetInstance() app := app.GetInstance()
document.InitizeModule() document.InitizeModule()
ipcChannel := Channel.GetInstance() ipcChannel := ipc.GetInstance()
// Create application with options // Create application with options
err := wails.Run(&options.App{ err := wails.Run(&options.App{