Skip to content

Commit

Permalink
feat(resource/interface): export notify
Browse files Browse the repository at this point in the history
  • Loading branch information
thelindat committed Apr 11, 2022
1 parent 285f30f commit e842185
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 10 deletions.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
local contextMenus = {}

local function showContext(id)
function lib.showContext(id)
local data = contextMenus[id]
SetNuiFocus(true, true)
SendNUIMessage({
Expand All @@ -13,7 +13,7 @@ local function showContext(id)
})
end

local function registerContext(context)
function lib.registerContext(context)
for k, v in pairs(context) do
if type(k) == 'number' then
contextMenus[v.id] = v
Expand All @@ -25,7 +25,7 @@ local function registerContext(context)
end

RegisterNUICallback('openContext', function(id)
showContext(id)
lib.showContext(id)
end)

RegisterNUICallback('clickContext', function(data)
Expand Down
19 changes: 19 additions & 0 deletions resource/interface/client/notify.lua
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
--[[```lua
{
id?: string
title?: string
description: string
duration?: number
position?: 'top' | 'top-right' | 'top-left' | 'bottom' | 'bottom-right' | 'bottom-left'
style?: table
icon?: string
iconColor?: string
}
```]]
---@param data table
function lib.notify(data)
SendNUIMessage({
action = 'customNotify',
data = data
})
end
31 changes: 24 additions & 7 deletions web/src/features/notifications/NotificationWrapper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ interface CustomProps {
iconColor?: string;
position?: ToastPositionWithLogical;
id?: number;
type?: string;
}

debugData<Props>([
Expand Down Expand Up @@ -59,23 +60,39 @@ debugData<CustomProps>([
const Notifications: React.FC = () => {
const toast = useToast();

// todo: figure out icon support
useNuiEvent<CustomProps>("customNotify", (data) => {
if (data.id && toast.isActive(data.id)) return;
if (!data.icon) {
//@ts-expect-error because amazing types
data.icon =
data.type === "error"
? "fa-circle-xmark"
: data.type === "success"
? "fa-circle-check"
: "fa-circle-info";
}

toast({
duration: data.duration || 4000,
duration: data.duration || 3000,
position: data.position || "top-right",
render: () => (
<Box style={data.style} p={3} borderRadius="md" boxShadow="lg">
<Box
className={`toast-${data.type || "inform"}`}
style={data.style}
p={2}
borderRadius="sm"
boxShadow="md"
>
<HStack spacing={0}>
{data.icon && (
{
<FontAwesomeIcon
//@ts-expect-error because amazing types
icon={data.icon}
fontSize="1.4rem"
style={{ paddingRight: 11 }}
fontSize="1.3em"
style={{ paddingRight: 8 }}
color={data.iconColor}
/>
)}
}
<Box w="100%">
{data.title && <Text as="b">{data.title}</Text>}
{data.description && <Text>{data.description}</Text>}
Expand Down
12 changes: 12 additions & 0 deletions web/src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -50,3 +50,15 @@ code {
width: 0;
height: 0;
}

.toast-inform {
background-color: #2980b9;
}

.toast-success {
background-color: #27ae60;
}

.toast-error {
background-color: #c0392b;
}

0 comments on commit e842185

Please sign in to comment.