From 65e49248f98a51aba6ebaaaf1963706c6b2274b6 Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Tue, 2 Jul 2024 15:59:24 +0100
Subject: [PATCH] add spacing and moved fetch repo button

---
 libs/remix-ui/git/src/components/gitui.tsx    |  6 +++---
 .../git/src/components/panels/remotes.tsx     | 19 ++++++++++---------
 .../src/components/panels/remotesimport.tsx   |  3 +--
 3 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/libs/remix-ui/git/src/components/gitui.tsx b/libs/remix-ui/git/src/components/gitui.tsx
index d723cc20ce..fb9566895b 100644
--- a/libs/remix-ui/git/src/components/gitui.tsx
+++ b/libs/remix-ui/git/src/components/gitui.tsx
@@ -200,16 +200,16 @@ export const GitUI = (props: IGitUi) => {
                     <hr></hr>
                     <BranchesNavigation eventKey="2" activePanel={activePanel} callback={setActivePanel} />
                     <Accordion.Collapse className='bg-light' eventKey="2">
-                      <div className="px-3">
+                      <div className="px-2">
                         <Branches />
                       </div>
                     </Accordion.Collapse>
                     <hr></hr>
                     <RemotesNavigation eventKey="5" activePanel={activePanel} callback={setActivePanel} />
                     <Accordion.Collapse className='bg-light' eventKey="5">
-                      <>
+                      <div className="px-2">
                         <Remotes plugin={plugin}></Remotes>
-                      </>
+                      </div>
                     </Accordion.Collapse>
                     <hr></hr>
                     <CloneNavigation eventKey="4" activePanel={activePanel} callback={setActivePanel} />
diff --git a/libs/remix-ui/git/src/components/panels/remotes.tsx b/libs/remix-ui/git/src/components/panels/remotes.tsx
index 4a0728f3e4..5d0b561b8a 100644
--- a/libs/remix-ui/git/src/components/panels/remotes.tsx
+++ b/libs/remix-ui/git/src/components/panels/remotes.tsx
@@ -30,9 +30,11 @@ export const Remotes = (props: RemotesProps) => {
 
   return (
     <>
-      <div data-id="remotes-panel-content">
+      <div data-id="remotes-panel-content" className="d-flex flex-column">
+        <RemotesImport plugin={props.plugin} />
+        <hr className="mt-0 border border-2" />
         {context.remotes && context.remotes.length ?
-          <>
+          <div>
 
             {context.remotes && context.remotes.map((remote, index) => {
 
@@ -40,18 +42,17 @@ export const Remotes = (props: RemotesProps) => {
                 <Remoteselect key={index} remote={remote}></Remoteselect>
               );
             })}
-          </> : <>No remotes</>}
-        <hr></hr>
+          </div> : <div>
+            <label className="text-uppercase">No remotes</label>
+          </div>}
 
-        <input placeholder="remote name" name='remotename' onChange={e => onRemoteNameChange(e.target.value)} value={remoteName} className="form-control mb-2" type="text" id="remotename" />
-        <input placeholder="remote url" name='remoteurl' onChange={e => onUrlChange(e.target.value)} value={url} className="form-control" type="text" id="remoteurl" />
+        <input placeholder="remote name" name='remotename' onChange={e => onRemoteNameChange(e.target.value)} value={remoteName} className="form-control mb-3" type="text" id="remotename" />
+        <input placeholder="remote url" name='remoteurl' onChange={e => onUrlChange(e.target.value)} value={url} className="form-control mb-3" type="text" id="remoteurl" />
 
         <button disabled={(remoteName && url) ? false : true} className='btn btn-primary mt-1 w-100' onClick={async () => {
           addRemote();
         }}>add remote</button>
-        <hr />
-        <RemotesImport plugin={props.plugin} />
-        <hr />
+        <hr className="mt-0 border border-2" />
       </div>
     </>)
 }
diff --git a/libs/remix-ui/git/src/components/panels/remotesimport.tsx b/libs/remix-ui/git/src/components/panels/remotesimport.tsx
index 9cbf4ec776..45c6013819 100644
--- a/libs/remix-ui/git/src/components/panels/remotesimport.tsx
+++ b/libs/remix-ui/git/src/components/panels/remotesimport.tsx
@@ -68,9 +68,8 @@ export const RemotesImport = (props: RemotesImportProps) => {
 
   return (
     <>
-      <TokenWarning plugin={props.plugin} />
       <RepositorySelect select={selectRepo} />
-
+      <TokenWarning plugin={props.plugin} />
       {repo ?
         <input data-id='remote-panel-remotename' placeholder="remote name" name='remotename' onChange={e => onRemoteNameChange(e.target.value)} value={remoteName} className="form-control mb-2" type="text" id="remotename" />
         : null}