Skip to content

Commit

Permalink
feat: toasts
Browse files Browse the repository at this point in the history
  • Loading branch information
Dwynr committed Apr 22, 2024
1 parent 8c5d90b commit 1a8c962
Show file tree
Hide file tree
Showing 9 changed files with 389 additions and 68 deletions.
4 changes: 3 additions & 1 deletion src/assets/fileExtensionIcons/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -195,7 +195,9 @@ export function directoryColorToHex(color: DirColors | null): string {
? "#AF52DE"
: color === "red"
? "#FF3B30"
: color
: color.includes("#")
? color
: "#85BCFF"
).toLowerCase()
}

Expand Down
5 changes: 4 additions & 1 deletion src/components/chats/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,17 @@ let didInitializeEmojisPreviously = false

export const Chats = memo(() => {
const isMobile = useIsMobile()
const { selectedConversation } = useChatsStore()
const { selectedConversation, setReplyMessage, setEditUUID } = useChatsStore()
const [conversationParticipantsContainerOpen] = useLocalStorage<boolean>(
`conversationParticipantsContainerOpen:${selectedConversation?.uuid}`,
true
)
const [emojisInitialized, setEmojisInitialized] = useState<boolean>(didInitializeEmojisPreviously)

useMountedEffect(() => {
setReplyMessage(null)
setEditUUID("")

initEmojiMart({
data: EmojiMartData,
custom: [
Expand Down
39 changes: 27 additions & 12 deletions src/components/drive/list/contextMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,28 +14,34 @@ import worker from "@/lib/worker"
import useRouteParent from "@/hooks/useRouteParent"
import eventEmitter from "@/lib/eventEmitter"
import { directoryUUIDToNameCache } from "@/cache"
import useLoadingToast from "@/hooks/useLoadingToast"
import useErrorToast from "@/hooks/useErrorToast"

export const ContextMenu = memo(({ children }: { children: React.ReactNode }) => {
const { setItems } = useDriveItemsStore()
const location = useLocation()
const { t } = useTranslation()
const [, startTransition] = useTransition()
const parent = useRouteParent()
const loadingToast = useLoadingToast()
const errorToast = useErrorToast()

const createFolder = useCallback(async () => {
try {
const inputResponse = await showInputDialog({
title: "newfolder",
continueButtonText: "create",
value: "",
autoFocusInput: true,
placeholder: "New folder"
})
const inputResponse = await showInputDialog({
title: "newfolder",
continueButtonText: "create",
value: "",
autoFocusInput: true,
placeholder: "New folder"
})

if (inputResponse.cancelled) {
return
}

if (inputResponse.cancelled) {
return
}
const toast = loadingToast()

try {
const item = await worker.createDirectory({ name: inputResponse.value, parent })

directoryUUIDToNameCache.set(item.uuid, inputResponse.value)
Expand All @@ -48,8 +54,17 @@ export const ContextMenu = memo(({ children }: { children: React.ReactNode }) =>
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [setItems, parent])
}, [setItems, parent, loadingToast, errorToast])

useEffect(() => {
const createFolderTriggerListener = eventEmitter.on("createFolderTrigger", createFolder)
Expand Down
106 changes: 99 additions & 7 deletions src/components/drive/list/item/contextMenu/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ import useLocation from "@/hooks/useLocation"
import { HexColorPicker } from "react-colorful"
import { useDebouncedCallback } from "use-debounce"
import { directoryColorToHex } from "@/assets/fileExtensionIcons"
import useLoadingToast from "@/hooks/useLoadingToast"
import useErrorToast from "@/hooks/useErrorToast"

export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; children: React.ReactNode }) => {
const { items, setItems } = useDriveItemsStore()
Expand All @@ -38,6 +40,8 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
useDriveSharedStore()
const location = useLocation()
const [directoryColor, setDirectoryColor] = useState<string>(directoryColorToHex(item.type === "directory" ? item.color : null))
const loadingToast = useLoadingToast()
const errorToast = useErrorToast()

const selectedItems = useMemo(() => {
return items.filter(item => item.selected)
Expand Down Expand Up @@ -84,6 +88,8 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
return
}

const toast = loadingToast()

try {
const parent = await selectDriveDestination()

Expand All @@ -101,8 +107,17 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems, setItems])
}, [selectedItems, setItems, errorToast, loadingToast])

const download = useCallback(async () => {
if (selectedItems.length === 0) {
Expand All @@ -121,6 +136,8 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
return
}

const toast = loadingToast()

try {
const trashedUUIDs = selectedItems.map(item => item.uuid)

Expand All @@ -133,14 +150,25 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems, setItems])
}, [selectedItems, setItems, loadingToast, errorToast])

const deletePermanently = useCallback(async () => {
if (selectedItems.length === 0) {
return
}

const toast = loadingToast()

try {
const deletedUUIDs = selectedItems.map(item => item.uuid)

Expand All @@ -153,14 +181,25 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems, setItems])
}, [selectedItems, setItems, loadingToast, errorToast])

const restore = useCallback(async () => {
if (selectedItems.length === 0) {
return
}

const toast = loadingToast()

try {
const restoredUUIDs = selectedItems.map(item => item.uuid)

Expand All @@ -171,8 +210,17 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems, setItems])
}, [selectedItems, setItems, loadingToast, errorToast])

const preview = useCallback(() => {
if (selectedItems.length !== 1 && previewType !== "other") {
Expand All @@ -187,6 +235,8 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
return
}

const toast = loadingToast()

try {
const item = selectedItems[0]
const newName = await actions.rename({ item })
Expand All @@ -196,15 +246,26 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems, setItems])
}, [selectedItems, setItems, loadingToast, errorToast])

const toggleFavorite = useCallback(
async (favorite: boolean) => {
if (selectedItems.length === 0) {
return
}

const toast = loadingToast()

try {
const uuids = selectedItems.map(item => item.uuid)

Expand All @@ -217,28 +278,50 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
},
[selectedItems, setItems]
[selectedItems, setItems, errorToast, loadingToast]
)

const share = useCallback(async () => {
if (selectedItems.length === 0) {
return
}

const toast = loadingToast()

try {
await actions.share({ selectedItems })
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, [selectedItems])
}, [selectedItems, loadingToast, errorToast])

const changeColor = useDebouncedCallback(async (color: string) => {
if (selectedItems.length !== 1) {
return
}

const toast = loadingToast()

try {
await actions.changeColor({ uuid: selectedItems[0].uuid, color })

Expand All @@ -247,6 +330,15 @@ export const ContextMenu = memo(({ item, children }: { item: DriveCloudItem; chi
})
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
}, 1000)

Expand Down
17 changes: 16 additions & 1 deletion src/components/drive/list/item/contextMenu/moveTree.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,13 @@ import { Loader } from "lucide-react"
import { useDriveItemsStore } from "@/stores/drive.store"
import { move as moveAction } from "./actions"
import { orderItemsByType } from "@/components/drive/utils"
import useErrorToast from "@/hooks/useErrorToast"
import useLoadingToast from "@/hooks/useLoadingToast"

export const MoveTree = memo(({ parent, name }: { parent: string; name: string }) => {
const { items, setItems } = useDriveItemsStore()
const errorToast = useErrorToast()
const loadingToast = useLoadingToast()

const query = useQuery({
queryKey: ["listDirectoryOnlyDirectories", parent],
Expand Down Expand Up @@ -44,6 +48,8 @@ export const MoveTree = memo(({ parent, name }: { parent: string; name: string }
return
}

const toast = loadingToast()

try {
const itemsToMove = selectedItems.filter(item => item.parent !== parent)

Expand All @@ -54,9 +60,18 @@ export const MoveTree = memo(({ parent, name }: { parent: string; name: string }
setItems(prev => prev.filter(prevItem => !movedUUIDs.includes(prevItem.uuid)))
} catch (e) {
console.error(e)

const toast = errorToast((e as unknown as Error).toString())

toast.update({
id: toast.id,
duration: 5000
})
} finally {
toast.dismiss()
}
},
[selectedItems, parent, setItems, canMove]
[selectedItems, parent, setItems, canMove, loadingToast, errorToast]
)

if (!canMove) {
Expand Down
Loading

0 comments on commit 1a8c962

Please sign in to comment.