Mb_notify [React Js][Notification]

FiveM Resource Development & Modding Releases
, , ,
1

mb_notify

A simple notification script with multiple options

Features
Displays notifications one by one (queue) so they can be spammed
Simple and Beautiful UI (Credits to Material UI library for react)

Download Here

How to use
Client side

exports['mb_notify']:sendNotification(yourMessage, options)

Server side

TriggerClientEvent('mb_notify:sendNotification', source, yourMessage, options)
Examples 
    exports['mb_notify']:sendNotification('this is default bottom center')
    exports['mb_notify']:sendNotification('this is error type top center', {type="error", vertical="top"})
	exports['mb_notify']:sendNotification('this is info type and filled variant top right', {type="info", vertical="top", horizontal="right", variant="filled"})
	exports['mb_notify']:sendNotification('this is warning type and outlined variant bottom right', {type="warning", horizontal="right", variant='outlined'})
	exports['mb_notify']:sendNotification('this is default top left with duration 1 second', {vertical='top', horizontal='left', duration=1000})
	exports['mb_notify']:sendNotification('this is default bottom left', {horizontal='left'})
Options

Options

  1. Duration (default 5000 ms)
  2. Types (default success, warning, info, and error)
  3. Positions (default bottom center)
  4. Notification variant (default standard, filled, and outlined)

Preview

image
image1602×932 297 KB

You can also use this as a reference on how to create react-fivem script, source code under notify folder.
Any suggestions are accepted!

9 Likes
2

pretty neat nice work!

1 Like
3

Nice work ! But i cant find the source code of react in repository

1 Like
4

My bad didn’t notice it was not uploaded. Fixed it!

1 Like
5

Great Work

1 Like
6

Great work buddy, but you put 2 different designs in there… Would be cool just to follow the inform notification design

7

Thanks! Not sure by what you mean inform design, but in Material UI documentation there are three variants of designs if that is what you meant. Standard, Filled, and Outlined, these are all different

8

If you use filled style just do all of them filled

9

Ahh, its just for the preview and also i made it available for devs to choose between the styles. But if they chose not to, they can always just leave it blank and the style will be standard by default.

10

@Pigrobot ooooh cool then

1 Like
11

Nice to see some more React stuff on the forums. Function components > class components tho! <3

1 Like
12

doesn’t work for me, 0 errors in console

13

Simple. Nice. Beautiful :+1:

1 Like
14

could you share your code? have you made sure the resource name is mb_notify?

15

hey,bro.what’s my problem

image
image1920×56 56.7 KB

16

Could you share how did you trigger the notification in the export or triggerclientevent?

17

image
image1463×80 7.04 KB
like this

sry.it’s my fault。now is working

1 Like
18

also for me … :frowning:

image
image1011×298 20.4 KB

i tried both, but also the simple one doesnt work :frowning:

19

are there any errors in f8? have you made sure that the resource started properly in server console?

20

no errors, thats the point. Ressource is started, i tried also with an ensure.