From 32c06414c530023e9f5d4e58d907dac9d649fbf2 Mon Sep 17 00:00:00 2001
From: utin-francis-peter <utinfrancis.dev@gmail.com>
Date: Sat, 8 Jun 2024 03:29:18 +0100
Subject: [PATCH] style: added theme adaptable RetryIcon component to Retry btn

---
 frontend/src/components/RetryIcon.tsx      | 17 +++++++++++++++++
 frontend/src/conversation/Conversation.tsx | 12 +++++++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/components/RetryIcon.tsx

diff --git a/frontend/src/components/RetryIcon.tsx b/frontend/src/components/RetryIcon.tsx
new file mode 100644
index 00000000..27ed6028
--- /dev/null
+++ b/frontend/src/components/RetryIcon.tsx
@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { SVGProps } from 'react';
+const RetryIcon = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    xmlSpace="preserve"
+    width={16}
+    height={16}
+    fill={props.fill}
+    stroke={props.stroke}
+    viewBox="0 0 383.748 383.748"
+    {...props}
+  >
+    <path d="M62.772 95.042C90.904 54.899 137.496 30 187.343 30c83.743 0 151.874 68.13 151.874 151.874h30C369.217 81.588 287.629 0 187.343 0c-35.038 0-69.061 9.989-98.391 28.888a182.423 182.423 0 0 0-47.731 44.705L2.081 34.641v113.365h113.91L62.772 95.042zM381.667 235.742h-113.91l53.219 52.965c-28.132 40.142-74.724 65.042-124.571 65.042-83.744 0-151.874-68.13-151.874-151.874h-30c0 100.286 81.588 181.874 181.874 181.874 35.038 0 69.062-9.989 98.391-28.888a182.443 182.443 0 0 0 47.731-44.706l39.139 38.952V235.742z" />
+  </svg>
+);
+export default RetryIcon;
diff --git a/frontend/src/conversation/Conversation.tsx b/frontend/src/conversation/Conversation.tsx
index 03eb240f..2bb9d101 100644
--- a/frontend/src/conversation/Conversation.tsx
+++ b/frontend/src/conversation/Conversation.tsx
@@ -19,6 +19,7 @@ import { FEEDBACK, Query } from './conversationModels';
 import { sendFeedback } from './conversationApi';
 import { useTranslation } from 'react-i18next';
 import ArrowDown from './../assets/arrow-down.svg';
+import RetryIcon from '../components/RetryIcon';
 export default function Conversation() {
   const queries = useSelector(selectQueries);
   const status = useSelector(selectStatus);
@@ -229,12 +230,21 @@ export default function Conversation() {
               There was an error during generation
             </p>
             <button
-              className="mt-3 rounded-full border-2 border-gray-400 py-3 px-8 text-lg text-gray-500 transition-colors delay-100  hover:border-gray-700 disabled:cursor-not-allowed dark:text-bright-gray"
+              className="mt-3 flex items-center justify-center gap-3 rounded-full border-2 border-gray-400 py-3 px-8  text-lg text-gray-500 transition-colors delay-100 hover:border-gray-500 disabled:cursor-not-allowed dark:text-bright-gray"
               disabled={status === 'loading'}
               onClick={() =>
                 handleQuestion(queries[queries.length - 1].prompt, true)
               }
             >
+              {/* <img
+                src={Retry}
+                alt="Reload icon"
+                className="w-4 dark:text-red-900"
+              /> */}
+              <RetryIcon
+                fill={isDarkTheme ? 'rgb(236 236 241)' : 'rgb(107 114 120)'}
+                stroke={isDarkTheme ? 'rgb(236 236 241)' : 'rgb(107 114 120)'}
+              />
               Retry
             </button>
           </div>