From 4ee98cec8da06fcd69632d07526810f9cdbe50e0 Mon Sep 17 00:00:00 2001
From: eagleon <outmyself@gmail.com>
Date: Wed, 18 Sep 2024 15:53:23 +0800
Subject: [PATCH] func(session): add IP address to the list of seesion

---
 .../sessions/[sessionId]/SessionInfo.tsx           |  8 +++++++-
 src/assets/ip.svg                                  | 14 ++++++++++++++
 src/components/icons.ts                            |  2 ++
 src/components/messages.ts                         |  1 +
 .../analytics/sessions/getWebsiteSession.ts        |  4 ++--
 5 files changed, 26 insertions(+), 3 deletions(-)
 create mode 100644 src/assets/ip.svg

diff --git a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
index 6f9a8f3d5..32317b072 100644
--- a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
+++ b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
@@ -46,7 +46,13 @@ export default function SessionInfo({ data }) {
           </Icon>
           {data?.city}
         </dd>
-
+        <dt>{formatMessage(labels.ip)}</dt>
+        <dd>
+          <Icon>
+            <Icons.IP />
+          </Icon>
+          {data?.ip}
+        </dd>
         <dt>{formatMessage(labels.os)}</dt>
         <dd>
           <TypeIcon type="os" value={data?.os?.toLowerCase()?.replaceAll(/\W/g, '-')} />
diff --git a/src/assets/ip.svg b/src/assets/ip.svg
new file mode 100644
index 000000000..c06a7f435
--- /dev/null
+++ b/src/assets/ip.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 20.234 20.234" xml:space="preserve">
+<g>
+	<path style="fill:#030104;" d="M6.776,4.72h1.549v6.827H6.776V4.72z M11.751,4.669c-0.942,0-1.61,0.061-2.087,0.143v6.735h1.53
+		V9.106c0.143,0.02,0.324,0.031,0.527,0.031c0.911,0,1.691-0.224,2.218-0.721c0.405-0.386,0.628-0.952,0.628-1.621
+		c0-0.668-0.295-1.234-0.729-1.579C13.382,4.851,12.702,4.669,11.751,4.669z M11.709,7.95c-0.222,0-0.385-0.01-0.516-0.041V5.895
+		c0.111-0.03,0.324-0.061,0.639-0.061c0.769,0,1.205,0.375,1.205,1.002C13.037,7.535,12.53,7.95,11.709,7.95z M10.117,0
+		C5.523,0,1.8,3.723,1.8,8.316s8.317,11.918,8.317,11.918s8.317-7.324,8.317-11.917S14.711,0,10.117,0z M10.138,13.373
+		c-3.05,0-5.522-2.473-5.522-5.524c0-3.05,2.473-5.522,5.522-5.522c3.051,0,5.522,2.473,5.522,5.522
+		C15.66,10.899,13.188,13.373,10.138,13.373z"/>
+</g>
+</svg>
\ No newline at end of file
diff --git a/src/components/icons.ts b/src/components/icons.ts
index 422f042ab..cbc140f62 100644
--- a/src/components/icons.ts
+++ b/src/components/icons.ts
@@ -24,6 +24,7 @@ import Sun from 'assets/sun.svg';
 import User from 'assets/user.svg';
 import Users from 'assets/users.svg';
 import Visitor from 'assets/visitor.svg';
+import IP from 'assets/ip.svg';
 
 const icons = {
   ...Icons,
@@ -52,6 +53,7 @@ const icons = {
   User,
   Users,
   Visitor,
+  IP,
 };
 
 export default icons;
diff --git a/src/components/messages.ts b/src/components/messages.ts
index f711a4f6c..83fdb0abf 100644
--- a/src/components/messages.ts
+++ b/src/components/messages.ts
@@ -217,6 +217,7 @@ export const labels = defineMessages({
   country: { id: 'label.country', defaultMessage: 'Country' },
   region: { id: 'label.region', defaultMessage: 'Region' },
   city: { id: 'label.city', defaultMessage: 'City' },
+  ip: { id: 'label.ip', defaultMessage: 'IP' },
   browser: { id: 'label.browser', defaultMessage: 'Browser' },
   device: { id: 'label.device', defaultMessage: 'Device' },
   pageTitle: { id: 'label.pageTitle', defaultMessage: 'Page title' },
diff --git a/src/queries/analytics/sessions/getWebsiteSession.ts b/src/queries/analytics/sessions/getWebsiteSession.ts
index 261985921..5eaf610a8 100644
--- a/src/queries/analytics/sessions/getWebsiteSession.ts
+++ b/src/queries/analytics/sessions/getWebsiteSession.ts
@@ -54,8 +54,8 @@ async function relationalQuery(websiteId: string, sessionId: string) {
     join website_event on website_event.session_id = session.session_id
     where session.website_id = {{websiteId::uuid}}
       and session.session_id = {{sessionId::uuid}}
-    group by session.session_id, visit_id, session.website_id, session.hostname, session.browser, session.os, session.device, session.screen, session.language, session.country, session.subdivision1, session.city) t
-    group by id, website_id, hostname, browser, os, device, screen, language, country, subdivision1, city;
+    group by session.session_id, visit_id, session.website_id, session.hostname, session.browser, session.os, session.device, session.screen, session.language, session.country, session.subdivision1, session.city, session.ip) t
+    group by id, website_id, hostname, browser, os, device, screen, language, country, subdivision1, city, ip;
     `,
     { websiteId, sessionId },
   ).then(result => result?.[0]);