From a9e71a85e827a32375b731709cb1c1a93c947187 Mon Sep 17 00:00:00 2001
From: vishalkrishnads <321vishalds@gmail.com>
Date: Wed, 19 Jun 2024 13:13:15 +0530
Subject: [PATCH 1/3] implemented tweetRoute()

---
 src/components/DriveView/Media.jsx | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/src/components/DriveView/Media.jsx b/src/components/DriveView/Media.jsx
index 10f5547d6..2231e08e6 100644
--- a/src/components/DriveView/Media.jsx
+++ b/src/components/DriveView/Media.jsx
@@ -239,6 +239,7 @@ class Media extends Component {
     this.copySegmentName = this.copySegmentName.bind(this);
     this.openInUseradmin = this.openInUseradmin.bind(this);
     this.shareCurrentRoute = this.shareCurrentRoute.bind(this);
+    this.tweetRoute = this.tweetRoute.bind(this);
     this.uploadFile = this.uploadFile.bind(this);
     this.uploadFilesAll = this.uploadFilesAll.bind(this);
     this.getUploadStats = this.getUploadStats.bind(this);
@@ -332,6 +333,23 @@ class Media extends Component {
     }
   }
 
+  tweetRoute() {
+    const { currentRoute } = this.props;
+
+    let percentage = 0, engagements = 0;
+    currentRoute.events
+      .filter((event) => event.data && event.data.end_route_offset_millis)
+      .forEach(event => {
+        if(event.type === 'engage') {
+          percentage += parseInt(((event.data.end_route_offset_millis - event.route_offset_millis) / currentRoute.duration) * 100);
+          engagements++;
+        }
+      })
+    
+    const post = `I went on a pretty chill drive ${currentRoute.startLocation?.place ? `from ${currentRoute.startLocation.place}` : ''}${currentRoute.endLocation?.place ? ` to ${currentRoute.endLocation.place}` : ''} in my ${currentRoute.platform.replace("_", ' ').toLowerCase()} as openpilot drove ~${percentage}% of the route with less than ${engagements+1} disengagements!\nCheck out the full drive on comma connect at ${window.location.href}.`; 
+    window.open(`https://twitter.com/intent/tweet?text=${encodeURIComponent(post)}`, '_blank').focus();
+  }
+
   async uploadFile(type) {
     const { dongleId, currentRoute } = this.props;
     if (!currentRoute) {
@@ -741,6 +759,10 @@ class Media extends Component {
             <ShareIcon />
           </MenuItem>
           )}
+          <MenuItem onClick={ this.tweetRoute } className={ classes.shareButton }>
+            Post on X
+            <ShareIcon />
+          </MenuItem>
           <Divider />
           <MenuItem onClick={ this.openInUseradmin }>
             View in useradmin

From d1c16572aa36d350ffecf81a053523ad460c82a5 Mon Sep 17 00:00:00 2001
From: vishalkrishnads <321vishalds@gmail.com>
Date: Wed, 19 Jun 2024 13:32:56 +0530
Subject: [PATCH 2/3] added icon

---
 src/components/DriveView/Media.jsx |  3 ++-
 src/components/DriveView/XIcon.jsx | 14 ++++++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 src/components/DriveView/XIcon.jsx

diff --git a/src/components/DriveView/Media.jsx b/src/components/DriveView/Media.jsx
index 2231e08e6..30aa72002 100644
--- a/src/components/DriveView/Media.jsx
+++ b/src/components/DriveView/Media.jsx
@@ -8,6 +8,7 @@ import { withStyles, Divider, Typography, Menu, MenuItem, CircularProgress, Butt
 import WarningIcon from '@material-ui/icons/Warning';
 import ContentCopyIcon from '@material-ui/icons/ContentCopy';
 import ShareIcon from '@material-ui/icons/Share';
+import XIcon from './XIcon';
 
 import { drives as Drives } from '@commaai/api';
 
@@ -761,7 +762,7 @@ class Media extends Component {
           )}
           <MenuItem onClick={ this.tweetRoute } className={ classes.shareButton }>
             Post on X
-            <ShareIcon />
+            <XIcon />
           </MenuItem>
           <Divider />
           <MenuItem onClick={ this.openInUseradmin }>
diff --git a/src/components/DriveView/XIcon.jsx b/src/components/DriveView/XIcon.jsx
new file mode 100644
index 000000000..94747add9
--- /dev/null
+++ b/src/components/DriveView/XIcon.jsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import SvgIcon from '@material-ui/core/SvgIcon';
+
+function XIcon(props) {
+    return (
+        <SvgIcon {...props}>
+            <g>
+                <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+            </g>
+        </SvgIcon>
+    );
+}
+
+export default XIcon;

From 97e3f24310649bb51369c9129f21a365c8cbec8f Mon Sep 17 00:00:00 2001
From: vishalkrishnads <321vishalds@gmail.com>
Date: Wed, 19 Jun 2024 13:49:12 +0530
Subject: [PATCH 3/3] fix tests failing

---
 src/components/DriveView/Media.jsx |  2 +-
 src/components/DriveView/XIcon.jsx | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/DriveView/Media.jsx b/src/components/DriveView/Media.jsx
index 30aa72002..f9c069503 100644
--- a/src/components/DriveView/Media.jsx
+++ b/src/components/DriveView/Media.jsx
@@ -343,7 +343,7 @@ class Media extends Component {
       .forEach(event => {
         if(event.type === 'engage') {
           percentage += parseInt(((event.data.end_route_offset_millis - event.route_offset_millis) / currentRoute.duration) * 100);
-          engagements++;
+          engagements += 1;
         }
       })
     
diff --git a/src/components/DriveView/XIcon.jsx b/src/components/DriveView/XIcon.jsx
index 94747add9..9bde5e3dd 100644
--- a/src/components/DriveView/XIcon.jsx
+++ b/src/components/DriveView/XIcon.jsx
@@ -1,14 +1,14 @@
-import React from 'react';
+import React, { Component } from 'react';
 import SvgIcon from '@material-ui/core/SvgIcon';
 
-function XIcon(props) {
-    return (
-        <SvgIcon {...props}>
+class XIcon extends Component {
+    render() {
+        return <SvgIcon {...this.props}>
             <g>
                 <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
             </g>
         </SvgIcon>
-    );
+    }
 }
 
 export default XIcon;