diff --git a/src/renderer/components/available-versions/available-versions-nav-bar.component.tsx b/src/renderer/components/available-versions/available-versions-nav-bar.component.tsx
new file mode 100644
index 00000000..b38fafbe
--- /dev/null
+++ b/src/renderer/components/available-versions/available-versions-nav-bar.component.tsx
@@ -0,0 +1,8 @@
+
+export function AvailableVersionsNavBar(props: {years: string[], setSelectedYear: Function}) {
+  return (
+    <div className="w-full h-fit flex justify-center items-center">
+      { props.years.map((y, index) => <span key={index} onClick={() => props.setSelectedYear(y)}>{y}</span>) }
+    </div>
+  )
+}