Open jonsnowpt opened 1 month ago
@Izobov
https://github.com/user-attachments/assets/d19abfc2-1d6a-4d7a-b002-c70623d507ea
@Izobov
@jonsnowpt 7 needs to be discussed with John. He suggested we that css variable for that. But I agree with you, it looks to dark. I changed it to another css variable there
@jonsnowpt we don't need preloaders for notifications/settings. Because we are goin to push that information in users information (like we have token balance, avatar and other info about the user), sou usually we will have all the necessary information before this page will be rendered.
@Izobov
@jonsnowpt 4. Discussed with designer here https://www.figma.com/design/jw9dph3VTh506gKpNtG8F3?node-id=1-11420&m=dev#906151241
@Izobov
11.
12.
15.
@jonsnowpt can you reload with cash?
it looks okay for me on test deployment
@jonsnowpt 14 are we talking about notification settings? If yes, than it also works for me
@Izobov
2 3
@jonsnowpt 1 Can you record video for 1st issue 2 Needs to be adjusted in firebase payload 3 Needs to be adjusted in firebase payload 4 Needs to be adjusted in firebase payload 5 What numbers are you talking about? You have All (1) Competition (1)? 6 Can you clarify what do you mean here?
@Izobov
Wrong color and icon position:
@jonsnowpt 3 it's hover effect bg, for "not read" notifications you have another bg
@jonsnowpt 3 it's hover effect bg, for "not read" notifications you have another bg
OK
📝 Feature Request Description
We will be adding cloud messaging from Firebase to send push notifications to users on laptops and mobile devices.
Since we already have Firebase configured, we just need to add the messaging service to the current configuration:
===
Service Worker Setup:
Create firebase-messaging-sw.js in your static folder:
importScripts('https://www.gstatic.com/firebasejs/9.0.0/firebase-app.js'); importScripts('https://www.gstatic.com/firebasejs/9.0.0/firebase-messaging.js');
Request Notification Permission and Get Token:
In your main Svelte component, request permission and get the FCM token:
Handle Messages:
Add a handler for foreground messages:
We will need to send a message to request authorization for the push messages. (After first login)
When the user agrees to receive the notifications should be added to the user list on the notification user table.
Example:
betarena_prod notifications user
id- integer, primary key, unique uid- text mobile_subscription- boolean desktop_subscription- boolean email_notification- boolean
Hasura authorization message:
betarena_prod notifications message_template
ID: 3
Translations:
betarena_prod translation notifications_message
ID: 2
ACCEPTANCE CRITERIA:
FIGMA:
https://www.figma.com/design/Our5F3rivxehftWdWTq1Zg/Betarena---Notifications?node-id=0-1&m=dev&t=0AC2bQJX7MWeQBRv-1
PROMPT:
https://www.figma.com/design/ucZbGBw46RVJOp3N1zfJEF/Prompt-for-notifications-%2F-push-messages?node-id=53-22940&m=dev