TradeList to script setup

src/components/ftbot/TradeList.vue

@@ -101,7 +101,7 @@
   </div>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 import { formatPercent, formatPrice } from '@/shared/formatters';
 import { MultiDeletePayload, MultiForcesellPayload, Trade } from '@/types';
@@ -111,13 +111,10 @@ import TradeProfit from './TradeProfit.vue';
 import TradeActions from './TradeActions.vue';
 import ForceExitForm from '@/components/ftbot/ForceExitForm.vue';
 
-import { defineComponent, ref, computed, watch } from 'vue';
+import { ref, computed, watch } from 'vue';
 import { useBotStore } from '@/stores/ftbotwrapper';
 
-export default defineComponent({
-  name: 'TradeList',
-  components: { ActionIcon, DateTimeTZ, TradeProfit, TradeActions, ForceExitForm },
-  props: {
+const props = defineProps({
   trades: { required: true, type: Array as () => Array<Trade> },
   title: { default: 'Trades', type: String },
   stakeCurrency: { required: false, default: '', type: String },
@@ -125,8 +122,7 @@ export default defineComponent({
   showFilter: { default: false, type: Boolean },
   multiBotView: { default: false, type: Boolean },
   emptyText: { default: 'No Trades to show.', type: String },
-  },
-  setup(props) {
+});
 const botStore = useBotStore();
 const currentPage = ref(1);
 const selectedItemIndex = ref();
@@ -271,31 +267,6 @@ export default defineComponent({
     }
   },
 );
-
-    return {
-      botStore,
-      currentPage,
-      selectedItemIndex,
-      filterText,
-      perPage,
-      tableFields,
-      rows,
-      tradesTable,
-      forceExitHandler,
-      forceExitPartialHandler,
-      handleContextMenuEvent,
-      removeTradeHandler,
-      onRowClicked,
-      onRowSelected,
-      feTrade,
-      forceExitVisible,
-      removeTradeVisible,
-      confirmExitText,
-      removeTradeModal,
-      forceExitExecuter,
-    };
-  },
-});
 </script>
 
 <style lang="scss" scoped>