@@ -404,6 +404,8 @@ <h3 class="text-xl font-extrabold">Chat with BLT Bot</h3>
404
404
notifications . forEach ( notification => {
405
405
const listItem = document . createElement ( 'li' ) ;
406
406
listItem . className = `p-4 hover:bg-gray-100 relative ${ notification . is_read ? '' : 'bg-blue-50' } ` ;
407
+ console . log ( "Printing notif link" )
408
+ console . log ( notification . link )
407
409
408
410
notif_icon_src = ""
409
411
if ( notification . notification_type == 'reward' ) {
@@ -416,20 +418,24 @@ <h3 class="text-xl font-extrabold">Chat with BLT Bot</h3>
416
418
417
419
418
420
const content = `
419
- <div class="flex items-center space-x-4 w-full notification-item" data-notification-id="${ notification . id } ">
420
- <img src="${ notif_icon_src } " class="h-12 w-12 object-cover" alt="Notification Icon">
421
- <div class="flex-1">
422
- <div class="flex justify-between items-start">
423
- <p class="text-xl font-medium text-gray-900 mb-1">${ notification . message } </p>
424
- ${ ! notification . is_read ? '<div class="flex items-center justify-center w-2 h-2 bg-red-500 rounded-full" style="min-width: 7px; min-height: 7px;"></div>' : '' }
425
- </div>
426
- <div class="flex items-center space-x-2 mt-1">
427
- <span class="text-sm text-gray-600">${ new Date ( notification . created_at ) . toLocaleString ( ) } </span>
428
- ${ ! notification . is_read ? '<span class="text-sm font-medium text-blue-600">New</span>' : '' }
429
- </div>
421
+ <div class="flex items-center space-x-4 w-full notification-item" data-notification-id="${ notification . id } " style="cursor: ${ notification . link ? 'pointer' : 'default' } ;">
422
+ ${ notification . link
423
+ ? `<a href="${ notification . link } " class="flex items-center space-x-4 w-full" target="_blank" rel="noopener noreferrer">`
424
+ : '' }
425
+ <img src="${ notif_icon_src } " class="h-12 w-12 object-cover" alt="Notification Icon">
426
+ <div class="flex-1">
427
+ <div class="flex justify-between items-start">
428
+ <p class="text-xl font-medium text-gray-900 mb-1">${ notification . message } </p>
429
+ ${ ! notification . is_read ? '<div class="flex items-center justify-center w-2 h-2 bg-red-500 rounded-full" style="min-width: 7px; min-height: 7px;"></div>' : '' }
430
+ </div>
431
+ <div class="flex items-center space-x-2 mt-1">
432
+ <span class="text-sm text-gray-600">${ new Date ( notification . created_at ) . toLocaleString ( ) } </span>
433
+ ${ ! notification . is_read ? '<span class="text-sm font-medium text-blue-600">New</span>' : '' }
434
+ </div>
435
+ </div>
436
+ ${ notification . link ? '</a>' : '' }
430
437
</div>
431
- </div>
432
- ` ;
438
+ ` ;
433
439
listItem . innerHTML = content ;
434
440
notificationList . appendChild ( listItem ) ;
435
441
} ) ;
@@ -475,56 +481,56 @@ <h3 class="text-xl font-extrabold">Chat with BLT Bot</h3>
475
481
</ script >
476
482
<!--Script for Dropdown button-->
477
483
< script >
478
- const organizationsBtn = document . getElementById ( "organizations-btn" ) ;
479
- const organizationsDropdown = document . getElementById ( "organizations-dropdown" ) ;
480
-
481
- if ( organizationsBtn && organizationsDropdown ) {
482
- organizationsBtn . addEventListener ( "click" , function ( e ) {
483
- e . preventDefault ( ) ;
484
- e . stopPropagation ( ) ;
485
-
486
- const isHidden = organizationsDropdown . classList . toggle ( 'hidden' ) ;
487
-
488
- if ( ! isHidden ) {
489
- const btnRect = organizationsBtn . getBoundingClientRect ( ) ;
490
- Object . assign ( organizationsDropdown . style , {
491
- position : 'fixed' ,
492
- top : `${ btnRect . bottom } px` ,
493
- left : `${ btnRect . left } px` ,
494
- minWidth : `${ btnRect . width } px` ,
495
- display : 'block' ,
496
- } ) ;
497
- } else {
498
- organizationsDropdown . style . display = 'none' ;
499
- }
500
- } ) ;
484
+ document . addEventListener ( "DOMContentLoaded" , function ( ) {
501
485
502
- // Close dropdown when clicking outside
503
- document . addEventListener ( "click" , function ( e ) {
504
- if ( ! organizationsBtn . contains ( e . target ) && ! organizationsDropdown . contains ( e . target ) ) {
505
- organizationsDropdown . classList . add ( 'hidden' ) ;
506
- organizationsDropdown . style . display = 'none' ;
507
- }
508
- } ) ;
509
- } else {
510
- console . error ( 'Required elements not found!' ) ;
511
- }
486
+ const organizationsBtn = document . getElementById ( "organizations-btn" ) ;
487
+ const organizationsDropdown = document . getElementById ( "organizations-dropdown" ) ;
512
488
513
- // Fix: Remove extra closing parenthesis here
514
- document . querySelectorAll ( '.filter-option' ) . forEach ( option => {
515
- option . addEventListener ( 'click' , function ( e ) {
516
- e . preventDefault ( ) ;
517
- const iconElement = this . querySelector ( 'i' ) ;
518
- const textContent = this . textContent . trim ( ) ;
519
-
520
- const selectedIcon = document . getElementById ( 'selected-icon' ) ;
521
- const selectedFilter = document . getElementById ( 'selected-filter' ) ;
489
+ if ( organizationsBtn && organizationsDropdown ) {
490
+ organizationsBtn . addEventListener ( "click" , function ( e ) {
491
+ e . preventDefault ( ) ;
492
+ e . stopPropagation ( ) ;
493
+
494
+ const isHidden = organizationsDropdown . classList . toggle ( 'hidden' ) ;
495
+
496
+ if ( ! isHidden ) {
497
+ const btnRect = organizationsBtn . getBoundingClientRect ( ) ;
498
+ Object . assign ( organizationsDropdown . style , {
499
+ position : 'fixed' ,
500
+ top : `${ btnRect . bottom } px` ,
501
+ left : `${ btnRect . left } px` ,
502
+ minWidth : `${ btnRect . width } px` ,
503
+ display : 'block' ,
504
+ } ) ;
505
+ } else {
506
+ organizationsDropdown . style . display = 'none' ;
507
+ }
508
+ } ) ;
509
+ // Close dropdown when clicking outside
510
+ document . addEventListener ( "click" , function ( e ) {
511
+ if ( ! organizationsBtn . contains ( e . target ) && ! organizationsDropdown . contains ( e . target ) ) {
512
+ organizationsDropdown . classList . add ( 'hidden' ) ;
513
+ organizationsDropdown . style . display = 'none' ;
514
+ }
515
+ } ) ;
516
+ } else {
517
+ console . error ( 'Required elements not found!' ) ;
518
+ }
519
+ document . querySelectorAll ( '.filter-option' ) . forEach ( option => {
520
+ option . addEventListener ( 'click' , function ( e ) {
521
+ e . preventDefault ( ) ;
522
+ const iconElement = this . querySelector ( 'i' ) ;
523
+ const textContent = this . textContent . trim ( ) ;
524
+
525
+ const selectedIcon = document . getElementById ( 'selected-icon' ) ;
526
+ const selectedFilter = document . getElementById ( 'selected-filter' ) ;
522
527
523
- selectedIcon . className = iconElement . className + ' mr-2' ;
524
- selectedFilter . textContent = textContent ;
525
-
526
- organizationsDropdown . classList . add ( 'hidden' ) ;
527
- organizationsDropdown . style . display = 'none' ;
528
+ selectedIcon . className = iconElement . className + ' mr-2' ;
529
+ selectedFilter . textContent = textContent ;
530
+
531
+ organizationsDropdown . classList . add ( 'hidden' ) ;
532
+ organizationsDropdown . style . display = 'none' ;
533
+ } ) ;
528
534
} ) ;
529
535
} ) ;
530
536
</ script >
0 commit comments