diff --git a/src/renderer/components/available-versions-array.component.tsx b/src/renderer/components/available-versions-array.component.tsx
index d5c7dcea..7287bef5 100644
--- a/src/renderer/components/available-versions-array.component.tsx
+++ b/src/renderer/components/available-versions-array.component.tsx
@@ -1,18 +1,23 @@
 import { BSVersion } from "../../main/services/bs-version-manager.service"
 import { useEffect, useState } from "react"
+import { BSVersionManagerService } from "renderer/services/bs-version-manager.service";
 
-export function AvailableVersionsArray({versions, setSelectedVersion}: {versions: BSVersion[], setSelectedVersion: Function}) {
+export function AvailableVersionsArray({setSelectedVersion}: {setSelectedVersion: Function}) {
 
-  const [versionsMap, setVersionsMap] = useState(new Map<string, BSVersion[]>())
+  const [versionsMap, setVersionsMap] = useState(new Map<string, BSVersion[]>());
+  const [versions, setVersions] = useState([] as BSVersion[]);
 
   console.log(setSelectedVersion);
 
   useEffect(() => {
-    organiseVersions()
+    BSVersionManagerService.getInstance().availableVersions$.subscribe(versions => {
+      organiseVersions(versions);
+      setVersions(versions);
+    });
   }, [])
   
 
-  const organiseVersions = () => {
+  const organiseVersions = (versions: BSVersion[]) => {
     const newMap = new Map<string, BSVersion[]>();
     versions.forEach(v => {
       newMap.set(v.year, [...(newMap.has(v.year) ? newMap.get(v.year)  : []), v]);
diff --git a/src/renderer/components/nav-bar/bs-version-item.component.tsx b/src/renderer/components/nav-bar/bs-version-item.component.tsx
index 7955b142..dab1fb78 100644
--- a/src/renderer/components/nav-bar/bs-version-item.component.tsx
+++ b/src/renderer/components/nav-bar/bs-version-item.component.tsx
@@ -5,10 +5,10 @@ import { SteamIcon } from "../svgs/steam-icon.component";
 
 export default function BsVersionItem(props: {version: BSVersion}) {
   return (
-    <div className='flex cursor-pointer w-max justify-center content-center items-center pr-1 text-red-600'>
-      {props.version.steam && <SteamIcon className="w-[19px] h-[19px] mr-1"/>}
-      {!props.version.steam && <BsNoteFill className="w-[22px] h-[22px] mr-1"/>}
-      <Link to={`/bs-version/${props.version.BSVersion}`} state={props.version} className="shrink-0 text-lg text-gray-200 font-bold min-w-0">{props.version.BSVersion}</Link>
-    </div>
+    <Link to={`/bs-version/${props.version.BSVersion}`} state={props.version} className='flex cursor-pointer w-max justify-center content-center items-center pr-1 mb-3'>
+      {props.version.steam && <SteamIcon className="w-[19px] h-[19px] mr-[6px]"/>}
+      {!props.version.steam && <BsNoteFill className="w-[19px] h-[19px] mr-[6px] text-red-600"/>}
+      <span className="shrink-0 text-lg text-gray-200 font-bold min-w-0">{props.version.BSVersion}</span>
+    </Link>
   )
 }
diff --git a/src/renderer/components/nav-bar/nav-bar.component.tsx b/src/renderer/components/nav-bar/nav-bar.component.tsx
index 3cbc2bc3..965f6475 100644
--- a/src/renderer/components/nav-bar/nav-bar.component.tsx
+++ b/src/renderer/components/nav-bar/nav-bar.component.tsx
@@ -1,13 +1,21 @@
 import { FaPlus, } from 'react-icons/fa';
 import { AiFillSetting } from 'react-icons/ai'
 import './nav-bar.component.css'
-import { useSelector } from 'react-redux';
 import BsVersionItem from './bs-version-item.component';
 import { BSVersion } from 'main/services/bs-version-manager.service';
+import { useEffect, useState } from 'react';
+import { BSVersionManagerService } from 'renderer/services/bs-version-manager.service';
 
 export function NavBar() {
 
-  const { installedVersions }: {installedVersions: BSVersion[]} = useSelector((state: any) => state.installedBSReducer);
+  const [installedVersions, setInstalledVersions] = useState([] as BSVersion[]);
+
+  useEffect(() => {
+    BSVersionManagerService.getInstance().installedVersions$.subscribe(versions => {
+      setInstalledVersions(versions);
+    })
+  }, [])
+  
 
   return (
     <div id='nav-bar' className='z-10 flex flex-col h-full max-h-full items-center p-2 bg-gray-200 dark:bg-main-color-1'>
diff --git a/src/renderer/pages/available-versions-list.components.tsx b/src/renderer/pages/available-versions-list.components.tsx
index 0ff64c16..060283c0 100644
--- a/src/renderer/pages/available-versions-list.components.tsx
+++ b/src/renderer/pages/available-versions-list.components.tsx
@@ -1,14 +1,10 @@
 import { BSVersion } from "../../main/services/bs-version-manager.service";
-import { useSelector } from "react-redux";
 import { AvailableVersionsArray } from "renderer/components/available-versions-array.component";
 import { useState } from "react";
-import { ModalService, ModalType } from "renderer/services/modale.service";
 import { BsDownloaderService } from "renderer/services/bs-downloader.service";
 
 export function AvailableVersionsList() {
 
-  const { availableVersions }: {availableVersions: BSVersion[]} = useSelector((state: any) => state.availableBsReducer);
-
   const [versionSelected, setVersionSelected] = useState(null as BSVersion);
 
   const bsDownloaderService: BsDownloaderService = BsDownloaderService.getInstance();
@@ -21,12 +17,10 @@ export function AvailableVersionsList() {
     bsDownloaderService.download(versionSelected);
   }
 
-  console.log(availableVersions);
-
   return (
     <div>
       <h1 className="w-full text-center font-bold text-gray-200 text-3xl mt-6 tracking-wider text-sh mb-5">CHOOSE BS VERSION</h1>
-      {availableVersions && <AvailableVersionsArray versions={availableVersions} setSelectedVersion={selectedVersionCallback}/>}
+      <AvailableVersionsArray setSelectedVersion={selectedVersionCallback}/>
       { versionSelected && (
         <>
           <h1 className="w-full text-2xl text-gray-200 font-bold text-center mt-5">SELECTED : {versionSelected.BSVersion}</h1>
diff --git a/src/renderer/services/bs-downloader.service.ts b/src/renderer/services/bs-downloader.service.ts
index efa9291c..27d192dd 100644
--- a/src/renderer/services/bs-downloader.service.ts
+++ b/src/renderer/services/bs-downloader.service.ts
@@ -1,5 +1,7 @@
+import { BehaviorSubject } from 'rxjs';
 import { DownloadInfo } from '../../main/ipcs/bs-download-ipcs';
 import { BSVersion } from '../../main/services/bs-version-manager.service'
+import { BSVersionManagerService } from './bs-version-manager.service';
 import { ModalExitCode, ModalService, ModalType } from './modale.service';
 
 export class BsDownloaderService{
@@ -7,6 +9,9 @@ export class BsDownloaderService{
     private static instance: BsDownloaderService;
 
     private readonly modalService: ModalService = ModalService.getInsance();
+    private readonly bsVersionManager: BSVersionManagerService = BSVersionManagerService.getInstance();
+
+    private readonly downloadedVersions$: BehaviorSubject<BSVersion[]> = new BehaviorSubject([]);
 
     private constructor(){
         window.electron.ipcRenderer.on(`bs-download.[Password]`, async (bsVersion: BSVersion) => {
@@ -16,12 +21,14 @@ export class BsDownloaderService{
         });
 
         window.electron.ipcRenderer.on("bs-download.[Guard]", async () => {
-            console.log("*** GUARD ***");
             const res = await this.modalService.openModal(ModalType.GUARD_CODE);
-            console.log(`***** res : ${res.exitCode}`);
             if(res.exitCode != ModalExitCode.COMPLETED){ return; }
             window.electron.ipcRenderer.sendMessage("bs-download.[Guard]", res.data);
         });
+
+        window.electron.ipcRenderer.on("bs-download.[Finished]", async () => {
+            this.bsVersionManager.askInstalledVersions();
+        });
     }
 
     public static getInstance(){