Adds svg icons for desktop, mobile or tablet devices to the alert email.

resources/lang/en/messages.php

@@ -22,5 +22,6 @@
     'ip_address' => 'IP Address',
     'browser' => 'Browser',
     'platform' => 'Platform',
+    'device' => 'Device',
     'ignore' => 'If this was you, you can ignore this alert. If you suspect any suspicious activity on your account, please change your password.',
 ];

resources/views/emails/new-device-alert.blade.php

@@ -1,13 +1,32 @@
 @component('mail::message')
 # @lang('auth-logger::messages.hello')!  
-  
+
 {{ Lang::get('auth-logger::messages.content', ['app' => config('app.name')]) }}
 
-> **@lang('auth-logger::messages.account'):** {{ $account->email }}<br>
-> **@lang('auth-logger::messages.time'):** {{ $time->toCookieString() }}<br>
-> **@lang('auth-logger::messages.ip_address'):** {{ $ipAddress }}<br>
-> **@lang('auth-logger::messages.browser'):** {{ $browser }} ({{ $browserVersion }})<br>
-> **@lang('auth-logger::messages.platform'):** {{ $platform }} ({{ $platformVersion }})  
+<table>
+    <tr>
+        <td align="center">
+            @if($deviceType == 'mobile')
+            <svg height="120px" width="120px" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"></path></svg>
+            @elseif($deviceType == 'desktop')
+            <svg height="120px" width="120px" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path></svg>
+            @elseif($deviceType == 'tablet')
+            <svg height="120px" width="120px" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"></path></svg>
+            @endif
+        </td>
+        <td width="75%">
+            <b>@lang('auth-logger::messages.account'):</b> {{ $account->email }}<br>
+            <b>@lang('auth-logger::messages.time'):</b> {{ $time->toCookieString() }}<br>
+            <b>@lang('auth-logger::messages.ip_address'):</b> {{ $ipAddress }}<br>
+            <b>@lang('auth-logger::messages.browser'):</b> {{ $browser }} <small>{{ $browserVersion ?? '' }}</small><br>
+            <b>@lang('auth-logger::messages.platform'):</b> {{ $platform }} <small>{{ $platformVersion ?? '' }}</small><br>
+            @if($deviceName)
+            <b>@lang('auth-logger::messages.device'):</b> {{ $deviceName }}
+            @endif
+        </td>
+    </tr>
+</table>  
+<br>  
 
 @lang('auth-logger::messages.ignore')  
 

src/Notifications/NewDeviceAlert.php

@@ -39,6 +39,16 @@ class NewDeviceAlert extends Notification implements ShouldQueue
      */
     public $platform;
 
+    /**
+     * User's device type retrived from the user agent.
+     */
+    public $deviceType;
+
+    /**
+     * User's device name (only for mobile devices).
+     */
+    public $deviceName = '';
+
     /**
      * Create a new notification instance.
      *
@@ -54,6 +64,16 @@ public function __construct(AuthLogger $authLogger)
         $this->agent->setUserAgent($authLogger->user_agent);
         $this->browser = $this->agent->browser();
         $this->platform = $this->agent->platform();
+
+        // Check device type and fetch device name for mobile.
+        if ($this->agent->isMobile()) {
+            $this->deviceType = 'mobile';
+            $this->deviceName = $this->agent->device();
+        } elseif ($this->agent->isTablet()) {
+            $this->deviceType = 'tablet';
+        } elseif ($this->agent->isDesktop()) {
+            $this->deviceType = 'desktop';
+        }
     }
 
     /**
@@ -85,6 +105,8 @@ public function toMail($notifiable)
                 'browserVersion' => $this->agent->version($this->browser),
                 'platform' => $this->platform,
                 'platformVersion' => $this->agent->version($this->platform),
+                'deviceType' => $this->deviceType,
+                'deviceName' => $this->deviceName,
             ]);
     }