diff --git a/src/App.vue b/src/App.vue
index ee889b96..476bc959 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,7 @@
 <template>
   <div id="app" class="d-flex flex-column vh-100">
     <NavBar />
-    <Body class="flex-fill overflow-auto" />
+    <BodyLayout class="flex-fill overflow-auto" />
     <NavFooter />
   </div>
 </template>
@@ -9,13 +9,13 @@
 <script lang="ts">
 import NavBar from '@/components/layout/NavBar.vue';
 import NavFooter from '@/components/layout/NavFooter.vue';
-import Body from '@/components/layout/Body.vue';
+import BodyLayout from '@/components/layout/BodyLayout.vue';
 import { setTimezone } from './shared/formatters';
 import { defineComponent, onMounted, watch } from 'vue';
 import { useSettingsStore } from './stores/settings';
 export default defineComponent({
   name: 'App',
-  components: { NavBar, Body, NavFooter },
+  components: { NavBar, BodyLayout, NavFooter },
   setup() {
     const settingsStore = useSettingsStore();
     onMounted(() => {
diff --git a/src/components/Login.vue b/src/components/BotLogin.vue
similarity index 100%
rename from src/components/Login.vue
rename to src/components/BotLogin.vue
diff --git a/src/components/ftbot/Balance.vue b/src/components/ftbot/BotBalance.vue
similarity index 100%
rename from src/components/ftbot/Balance.vue
rename to src/components/ftbot/BotBalance.vue
diff --git a/src/components/layout/Body.vue b/src/components/layout/BodyLayout.vue
similarity index 60%
rename from src/components/layout/Body.vue
rename to src/components/layout/BodyLayout.vue
index 0a7e31d2..e518e958 100644
--- a/src/components/layout/Body.vue
+++ b/src/components/layout/BodyLayout.vue
@@ -5,14 +5,8 @@
   </main>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
+<script setup lang="ts">
 import BotAlerts from '@/components/ftbot/BotAlerts.vue';
-
-export default defineComponent({
-  name: 'Body',
-  components: { BotAlerts },
-});
 </script>
 <style lang="scss" scoped>
 .container-main {
diff --git a/src/router/index.ts b/src/router/index.ts
index e7b0da90..04eb7e9d 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -38,7 +38,7 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/balance',
     name: 'Freqtrade Balance',
-    component: () => import('@/components/ftbot/Balance.vue'),
+    component: () => import('@/components/ftbot/BotBalance.vue'),
   },
   {
     path: '/open_trades',
diff --git a/src/views/LoginModal.vue b/src/views/LoginModal.vue
index bb39fb86..6caf2035 100644
--- a/src/views/LoginModal.vue
+++ b/src/views/LoginModal.vue
@@ -20,7 +20,7 @@
 </template>
 
 <script setup lang="ts">
-import Login from '@/components/Login.vue';
+import Login from '@/components/BotLogin.vue.js';
 import { AuthStorageWithBotId } from '@/types';
 import { nextTick, ref } from 'vue';
 import LoginIcon from 'vue-material-design-icons/Login.vue';
diff --git a/src/views/LoginView.vue b/src/views/LoginView.vue
index adfc92d3..d95f69c2 100644
--- a/src/views/LoginView.vue
+++ b/src/views/LoginView.vue
@@ -9,7 +9,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 
-import Login from '@/components/Login.vue';
+import Login from '@/components/BotLogin.vue.js';
 
 export default defineComponent({
   name: 'LoginView',
diff --git a/src/views/TradingView.vue b/src/views/TradingView.vue
index 5d7be213..a6900cf1 100644
--- a/src/views/TradingView.vue
+++ b/src/views/TradingView.vue
@@ -148,7 +148,7 @@
 <script setup lang="ts">
 import { GridItemData } from '@/types';
 
-import Balance from '@/components/ftbot/Balance.vue';
+import Balance from '@/components/ftbot/BotBalance.vue.js';
 import BotControls from '@/components/ftbot/BotControls.vue';
 import BotStatus from '@/components/ftbot/BotStatus.vue';
 import CandleChartContainer from '@/components/charts/CandleChartContainer.vue';
