forked from aws-samples/amplify-next-template
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #103 from cabcookie:search-and-inbox-improvements
# Kleinere Veränderungen - Bei Suchen nach Personen, Accounts und Projekten musste auf Groß- und Kleinschreibung geachtet werden. Das ist nun nicht mehr so. - Actions mit Bullet Points sahen in der Vorschau bei einem geschlossenen Accordion etwas komisch aus und waren mit doppelten Kommas durchsät. Das ist jetzt nicht mehr so. - Das Erstellen eines neuen Eintrags in der Inbox ist in das Navigationsmenü und in den Header verlegt worden.
- Loading branch information
Showing
12 changed files
with
245 additions
and
61 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
import { Plus } from "lucide-react"; | ||
import { useCreateInboxItemContext } from "../inbox/CreateInboxItemDialog"; | ||
import { Button } from "../ui/button"; | ||
import { | ||
Tooltip, | ||
TooltipContent, | ||
TooltipProvider, | ||
TooltipTrigger, | ||
} from "../ui/tooltip"; | ||
|
||
const CreateInboxItem = () => { | ||
const { open } = useCreateInboxItemContext(); | ||
|
||
return ( | ||
<TooltipProvider> | ||
<Tooltip> | ||
<TooltipTrigger asChild> | ||
<Button variant="ghost" onClick={open}> | ||
<Plus className="text-[--context-color]" /> | ||
</Button> | ||
</TooltipTrigger> | ||
<TooltipContent> | ||
<p>Create a new inbox item</p> | ||
</TooltipContent> | ||
</Tooltip> | ||
</TooltipProvider> | ||
); | ||
}; | ||
|
||
export default CreateInboxItem; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,145 @@ | ||
import { type Schema } from "@/amplify/data/resource"; | ||
import { handleApiErrors } from "@/api/globals"; | ||
import useInbox from "@/api/useInbox"; | ||
import { generateClient } from "aws-amplify/data"; | ||
import { FC, ReactNode, createContext, useContext, useState } from "react"; | ||
import NotesWriter, { | ||
EditorJsonContent, | ||
getTextFromEditorJsonContent, | ||
} from "../ui-elements/notes-writer/NotesWriter"; | ||
import { Button } from "../ui/button"; | ||
import { | ||
Dialog, | ||
DialogClose, | ||
DialogContent, | ||
DialogDescription, | ||
DialogFooter, | ||
DialogHeader, | ||
DialogTitle, | ||
} from "../ui/dialog"; | ||
import { useToast } from "../ui/use-toast"; | ||
|
||
const client = generateClient<Schema>(); | ||
|
||
interface CreateInboxItemContextType { | ||
state: boolean; | ||
open: () => void; | ||
close: () => void; | ||
inboxItemText: EditorJsonContent | undefined; | ||
setInboxItemText: (val: { json: EditorJsonContent } | undefined) => void; | ||
createInboxItem: () => Promise<string | undefined>; | ||
} | ||
|
||
interface CreateInobxItemProviderProps { | ||
children: ReactNode; | ||
} | ||
|
||
export const CreateInboxItemProvider: FC<CreateInobxItemProviderProps> = ({ | ||
children, | ||
}) => { | ||
const [isOpen, setIsOpen] = useState(false); | ||
const { mutateInbox } = useInbox(); | ||
const [inboxItemText, setInboxItemText] = useState< | ||
EditorJsonContent | undefined | ||
>(); | ||
const { toast } = useToast(); | ||
|
||
const handleUpdate = (val: { json: EditorJsonContent } | undefined) => | ||
val && setInboxItemText(val.json); | ||
|
||
const createInboxItem = async () => { | ||
if (!inboxItemText) return; | ||
const { data, errors } = await client.models.Inbox.create({ | ||
noteJson: JSON.stringify(inboxItemText), | ||
note: null, | ||
formatVersion: 2, | ||
status: "new", | ||
}); | ||
if (errors) handleApiErrors(errors, "Error creating inbox item"); | ||
if (!data) return; | ||
toast({ | ||
title: "New Inbox Item Created", | ||
description: getTextFromEditorJsonContent(inboxItemText), | ||
}); | ||
mutateInbox({ | ||
id: crypto.randomUUID(), | ||
createdAt: new Date(), | ||
status: "new", | ||
note: inboxItemText, | ||
}); | ||
setInboxItemText(undefined); | ||
setIsOpen(false); | ||
return data.id; | ||
}; | ||
|
||
return ( | ||
<CreateInboxItemContext.Provider | ||
value={{ | ||
state: isOpen, | ||
open: () => setIsOpen(true), | ||
close: () => setIsOpen(false), | ||
inboxItemText, | ||
setInboxItemText: handleUpdate, | ||
createInboxItem, | ||
}} | ||
> | ||
{children} | ||
</CreateInboxItemContext.Provider> | ||
); | ||
}; | ||
|
||
const CreateInboxItemContext = createContext< | ||
CreateInboxItemContextType | undefined | ||
>(undefined); | ||
|
||
export const useCreateInboxItemContext = () => { | ||
const context = useContext(CreateInboxItemContext); | ||
if (!context) | ||
throw new Error( | ||
"useCreateInboxItemContext must be used within CreateInboxItemProvider" | ||
); | ||
return context; | ||
}; | ||
|
||
const CreateInboxItemDialog = () => { | ||
const { | ||
state, | ||
open, | ||
close, | ||
inboxItemText, | ||
setInboxItemText, | ||
createInboxItem, | ||
} = useCreateInboxItemContext(); | ||
|
||
return ( | ||
<Dialog open={state} onOpenChange={() => (state ? close() : open())}> | ||
<DialogContent className="sm:max-w-[425px] md:max-w-[600px]"> | ||
<DialogHeader> | ||
<DialogTitle>Create a New Inbox Item</DialogTitle> | ||
<DialogDescription> | ||
Get it out of your head so you can process and organize it later and | ||
continue to focus on what matters now. | ||
</DialogDescription> | ||
</DialogHeader> | ||
<NotesWriter | ||
notes={inboxItemText || ""} | ||
placeholder="What's on your mind?" | ||
saveNotes={(serializer) => setInboxItemText(serializer())} | ||
showSaveStatus={false} | ||
autoFocus | ||
/> | ||
{JSON.stringify(inboxItemText)} | ||
<DialogFooter> | ||
<Button onClick={createInboxItem}>Save Item</Button> | ||
<DialogClose asChild> | ||
<Button type="button" variant="secondary"> | ||
Close | ||
</Button> | ||
</DialogClose> | ||
</DialogFooter> | ||
</DialogContent> | ||
</Dialog> | ||
); | ||
}; | ||
|
||
export default CreateInboxItemDialog; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.