From b117093aff924add46f979aea9a549cbe3145dcb Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 02:18:29 +0300
Subject: [PATCH 1/7] feat: Add arrow symbol to polyline in RouteMap component

---
 src/components/map/RouteMap.svelte | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/src/components/map/RouteMap.svelte b/src/components/map/RouteMap.svelte
index 24921ae..e2c922f 100644
--- a/src/components/map/RouteMap.svelte
+++ b/src/components/map/RouteMap.svelte
@@ -39,6 +39,7 @@
 
 			if (shape) {
 				polyline = await createPolyline(shape);
+				addArrowToPolyline();
 				polyline.setMap(map);
 			}
 		}
@@ -54,6 +55,25 @@
 		}
 	}
 
+	function addArrowToPolyline() {
+		const arrowSymbol = {
+			path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
+			scale: 2,
+			strokeColor: '#FF0000',
+			strokeWeight: 3
+		};
+
+		polyline.setOptions({
+			icons: [
+				{
+					icon: arrowSymbol,
+					offset: '100%',
+					repeat: '50px'
+				}
+			]
+		});
+	}
+
 	function addStopMarker(stopTime, stop) {
 		const marker = new google.maps.Marker({
 			position: { lat: stop.lat, lng: stop.lon },

From 3a6be19290746b9ad6584b3b3998d0232d24c7da Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 02:18:34 +0300
Subject: [PATCH 2/7] refactor: Remove unnecessary console.log statement in
 +server.js

---
 src/routes/api/oba/shape/[shapeId]/+server.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/routes/api/oba/shape/[shapeId]/+server.js b/src/routes/api/oba/shape/[shapeId]/+server.js
index 7569916..8eb0596 100644
--- a/src/routes/api/oba/shape/[shapeId]/+server.js
+++ b/src/routes/api/oba/shape/[shapeId]/+server.js
@@ -9,7 +9,6 @@ export async function GET({ params }) {
 
 	try {
 		const response = await fetch(apiURL);
-		console.log('response:', response);
 
 		if (!response.ok) {
 			throw new Error(`HTTP error! status: ${response.status}`);

From 59b7e16f81df1a0834098472fa4f5e5029a15199 Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 12:26:12 +0300
Subject: [PATCH 3/7] refactor: removed addArrowToPolyline function

---
 src/components/map/RouteMap.svelte | 23 ++---------------------
 1 file changed, 2 insertions(+), 21 deletions(-)

diff --git a/src/components/map/RouteMap.svelte b/src/components/map/RouteMap.svelte
index e2c922f..a031510 100644
--- a/src/components/map/RouteMap.svelte
+++ b/src/components/map/RouteMap.svelte
@@ -1,7 +1,7 @@
 <script>
 	/* global google */
 	import { onMount, onDestroy } from 'svelte';
-	import { createPolyline, loadGoogleMapsLibrary } from '$lib/googleMaps';
+	import { createPolyline, loadGoogleMapsLibrary, addArrowToPolyline } from '$lib/googleMaps';
 
 	export let map;
 	export let tripId;
@@ -39,7 +39,7 @@
 
 			if (shape) {
 				polyline = await createPolyline(shape);
-				addArrowToPolyline();
+				addArrowToPolyline(polyline);
 				polyline.setMap(map);
 			}
 		}
@@ -55,25 +55,6 @@
 		}
 	}
 
-	function addArrowToPolyline() {
-		const arrowSymbol = {
-			path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
-			scale: 2,
-			strokeColor: '#FF0000',
-			strokeWeight: 3
-		};
-
-		polyline.setOptions({
-			icons: [
-				{
-					icon: arrowSymbol,
-					offset: '100%',
-					repeat: '50px'
-				}
-			]
-		});
-	}
-
 	function addStopMarker(stopTime, stop) {
 		const marker = new google.maps.Marker({
 			position: { lat: stop.lat, lng: stop.lon },

From a364a89e5e4c3e6d2996432d7100febc6ceeca67 Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 12:26:21 +0300
Subject: [PATCH 4/7] feat: Add COLORS constant

---
 src/lib/colors.js | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 src/lib/colors.js

diff --git a/src/lib/colors.js b/src/lib/colors.js
new file mode 100644
index 0000000..e29a715
--- /dev/null
+++ b/src/lib/colors.js
@@ -0,0 +1,4 @@
+export const COLORS = {
+	POLYLINE: '#00FF00',
+	POLYLINE_ARROW: '#FF1111'
+};

From af6561f366a269efc32461605c3ceabea1dbde6a Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 12:26:47 +0300
Subject: [PATCH 5/7] feat: Add arrow symbol to polyline

---
 src/lib/googleMaps.js | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/lib/googleMaps.js b/src/lib/googleMaps.js
index c0d269d..4434684 100644
--- a/src/lib/googleMaps.js
+++ b/src/lib/googleMaps.js
@@ -1,3 +1,5 @@
+import { COLORS } from '$lib/colors';
+
 /**
  * Loads the Google Maps JavaScript library.
  * @param {string} apiKey - The API key for accessing the Google Maps API.
@@ -154,10 +156,33 @@ export async function createPolyline(shape) {
 	const polyline = new window.google.maps.Polyline({
 		path,
 		geodesic: true,
-		strokeColor: '#00FF00',
+		strokeColor: COLORS.POLYLINE,
 		strokeOpacity: 1.0,
 		strokeWeight: 4
 	});
 
 	return polyline;
 }
+
+/**
+ * Adds an arrow to the polyline.
+ * @param {google.maps.Polyline} polyline - The polyline to which the arrow will be added.
+ */
+export function addArrowToPolyline(polyline) {
+	const arrowSymbol = {
+		path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
+		scale: 2,
+		strokeColor: COLORS.POLYLINE_ARROW,
+		strokeWeight: 3
+	};
+
+	polyline.setOptions({
+		icons: [
+			{
+				icon: arrowSymbol,
+				offset: '100%',
+				repeat: '50px'
+			}
+		]
+	});
+}

From 637187c998a92bad2e12f0e3e44cc4a2b48d5342 Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 13:43:58 +0300
Subject: [PATCH 6/7] refactor: Update POLYLINE_ARROW color in COLORS constant

---
 src/lib/colors.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/colors.js b/src/lib/colors.js
index e29a715..bed7e97 100644
--- a/src/lib/colors.js
+++ b/src/lib/colors.js
@@ -1,4 +1,4 @@
 export const COLORS = {
 	POLYLINE: '#00FF00',
-	POLYLINE_ARROW: '#FF1111'
+	POLYLINE_ARROW: '#8250DF'
 };

From 794fdd88994a14b04ddf5cb2e5fc120c6467a499 Mon Sep 17 00:00:00 2001
From: Ahmedhossamdev <ahmedhossamdev1@gmail.com>
Date: Fri, 23 Aug 2024 13:51:15 +0300
Subject: [PATCH 7/7] refactor: Improve error handling in addArrowToPolyline
 function

---
 src/lib/googleMaps.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/lib/googleMaps.js b/src/lib/googleMaps.js
index 4434684..fce1d94 100644
--- a/src/lib/googleMaps.js
+++ b/src/lib/googleMaps.js
@@ -169,6 +169,10 @@ export async function createPolyline(shape) {
  * @param {google.maps.Polyline} polyline - The polyline to which the arrow will be added.
  */
 export function addArrowToPolyline(polyline) {
+	if (!(polyline instanceof google.maps.Polyline)) {
+		console.error('Invalid polyline');
+		return;
+	}
 	const arrowSymbol = {
 		path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
 		scale: 2,