diff --git a/app/Api/V2/Controllers/Controller.php b/app/Api/V2/Controllers/Controller.php
index 02631c38cd..4717fdae0c 100644
--- a/app/Api/V2/Controllers/Controller.php
+++ b/app/Api/V2/Controllers/Controller.php
@@ -92,8 +92,8 @@ class Controller extends BaseController
         if ($page < 1) {
             $page = 1;
         }
-        if ($page > (2 ^ 16)) {
-            $page = (2 ^ 16);
+        if ($page > pow(2,16)) {
+            $page = pow(2,16);
         }
         $bag->set('page', $page);
 
diff --git a/app/Api/V2/Controllers/Model/ExchangeRate/ShowController.php b/app/Api/V2/Controllers/Model/ExchangeRate/ShowController.php
index 0517dc6eec..5085aa08ae 100644
--- a/app/Api/V2/Controllers/Model/ExchangeRate/ShowController.php
+++ b/app/Api/V2/Controllers/Model/ExchangeRate/ShowController.php
@@ -57,13 +57,13 @@ class ShowController extends Controller
 
     public function show(TransactionCurrency $from, TransactionCurrency $to): JsonResponse
     {
-//        $piggies   = $this->repository->getAll();
-//
-        $pageSize = $this->parameters->get('limit');
-        $rates    = $this->repository->getRates($from, $to);
+        $pageSize  = $this->parameters->get('limit');
+        $page      = $this->parameters->get('page');
+        $rates     = $this->repository->getRates($from, $to);
         $count     = $rates->count();
-        $rates    = $rates->slice(($this->parameters->get('page') - 1) * $pageSize, $pageSize);
-        $paginator = new LengthAwarePaginator($rates, $count, $pageSize, $this->parameters->get('page'));
+
+        $rates     = $rates->slice(($page - 1) * $pageSize, $pageSize);
+        $paginator = new LengthAwarePaginator($rates, $count, $pageSize, $page);
 
         $transformer = new ExchangeRateTransformer();
         $transformer->setParameters($this->parameters); // give params to transformer
diff --git a/app/Repositories/UserGroups/ExchangeRate/ExchangeRateRepository.php b/app/Repositories/UserGroups/ExchangeRate/ExchangeRateRepository.php
index 5ae0292cbd..e89a9d2521 100644
--- a/app/Repositories/UserGroups/ExchangeRate/ExchangeRateRepository.php
+++ b/app/Repositories/UserGroups/ExchangeRate/ExchangeRateRepository.php
@@ -35,17 +35,19 @@ class ExchangeRateRepository implements ExchangeRateRepositoryInterface
 
     #[\Override] public function getRates(TransactionCurrency $from, TransactionCurrency $to): Collection
     {
+        // orderBy('date', 'DESC')->toRawSql();
         return
             $this->userGroup->currencyExchangeRates()
-                            ->where(function (Builder $q) use ($from, $to) {
-                                $q->where('from_currency_id', $from->id)
-                                  ->orWhere('to_currency_id', $to->id);
+                            ->where(function (Builder $q1) use ($from, $to) {
+                                $q1->where(function (Builder $q) use ($from, $to) {
+                                    $q->where('from_currency_id', $from->id)
+                                      ->where('to_currency_id', $to->id);
+                                })->orWhere(function (Builder $q) use ($from, $to) {
+                                    $q->where('from_currency_id', $to->id)
+                                      ->where('to_currency_id', $from->id);
+                                });
                             })
-                            ->orWhere(function (Builder $q) use ($from, $to) {
-                                $q->where('from_currency_id', $to->id)
-                                  ->orWhere('to_currency_id', $from->id);
-                            })
-                            ->orderBy('date', 'DESC')->get();
+                            ->orderBy('date', 'DESC')->get(['currency_exchange_rates.*']);
 
     }
 }
diff --git a/resources/assets/v1/src/components/exchange-rates/Rates.vue b/resources/assets/v1/src/components/exchange-rates/Rates.vue
index f2a1328379..053deb40ea 100644
--- a/resources/assets/v1/src/components/exchange-rates/Rates.vue
+++ b/resources/assets/v1/src/components/exchange-rates/Rates.vue
@@ -19,7 +19,6 @@
   -->
 
 
-
 <template>
     <div>
         <div class="row">
@@ -53,6 +52,42 @@
                             </tr>
                             </thead>
                             <tbody>
+                            <tr v-if="loading">
+                                <td colspan="4" class="text-center">
+                                    <i class="fa fa-refresh fa-spin"></i>
+                                </td>
+                            </tr>
+                            <tr v-if="0 === this.rates.length">
+                                <td colspan="4" class="text-center">
+                                    <i class="fa fa-battery-empty"></i>
+                                </td>
+                            </tr>
+                            <tr v-for="(rate, index) in rates" :key="rate.key">
+                                <td>
+                                    <input
+                                        ref="date"
+                                        :value="rate.date_field"
+                                        autocomplete="off"
+                                        class="form-control"
+                                        name="date[]"
+                                        type="date"
+                                        v-bind:placeholder="$t('firefly.date')"
+                                        v-bind:title="$t('firefly.date')"
+                                    >
+                                    </td>
+                                <td>
+                                    <input type="number" class="form-control" min="0" v-model="rate.rate">
+                                </td>
+                                <td>
+                                    <input type="number" class="form-control" min="0" v-model="rate.inverse">
+                                </td>
+                                <td>
+                                    <button class="btn btn-danger" @click="deleteRate(index)">
+                                        <em class="fa fa-trash"></em>
+                                    </button>
+                                    update + delete
+                                </td>
+                            </tr>
                             </tbody>
                         </table>
                     </div>
@@ -62,11 +97,15 @@
     </div>
 </template>
 <script>
+
+import format from "date-fns/format";
+
 export default {
     name: "Rates",
     data() {
         return {
             rates: [],
+            tempRates: {},
             from_code: '',
             to_code: '',
             from: {
@@ -75,6 +114,7 @@ export default {
             to: {
                 name: ''
             },
+            loading: true,
         };
     },
     mounted() {
@@ -82,11 +122,19 @@ export default {
         let parts = window.location.href.split('/');
         this.from_code = parts[parts.length - 2].substring(0, 3);
         this.to_code = parts[parts.length - 1].substring(0, 3);
-        console.log('From: ' + this.from_code + ' To: ' + this.to_code);
         this.downloadCurrencies();
+        this.downloadRates(1);
     },
     methods: {
-        downloadCurrencies: function() {
+        deleteRate: function(index) {
+            console.log(this.rates[index].key);
+            this.rates.splice(index, 1);
+        },
+        updateRate: function(index) {
+            console.log('Update!');
+            console.log(this.rates[index].key);
+        },
+        downloadCurrencies: function () {
             axios.get("./api/v2/currencies/" + this.from_code).then((response) => {
                 this.from = {
                     id: response.data.data.id,
@@ -103,7 +151,59 @@ export default {
                 }
             });
         },
-    }
+        downloadRates: function (page) {
+            axios.get("./api/v2/exchange-rates/rates/" + this.from_code + '/' + this.to_code + '?page=' + page).then((response) => {
+                for (let i in response.data.data) {
+                    if (response.data.data.hasOwnProperty(i)) {
+                        let current = response.data.data[i];
+                        let date = new Date(current.attributes.date);
+                        let from_code = current.attributes.from_currency_code;
+                        let to_code = current.attributes.to_currency_code;
+                        let rate = current.attributes.rate;
+                        let inverse = '';
+                        let key = from_code + '_' + to_code + '_' + format(date, 'yyyy-MM-dd');
+                        console.log('Key is now "' + key + '"');
+
+                        // perhaps the returned rate is actually the inverse rate.
+                        if(from_code === this.to_code && to_code === this.from_code) {
+                            console.log('Inverse rate found!');
+                            key = to_code + '_' + from_code + '_' + format(date, 'yyyy-MM-dd');
+                            rate = '';
+                            inverse = current.attributes.rate;
+                            console.log('Key updated to "' + key + '"');
+                        }
+                        // inverse is not "" and existing inverse is ""?
+                        if (this.tempRates.hasOwnProperty(key) && inverse !== '' && this.tempRates[key].inverse === '') {
+                            this.tempRates[key].inverse = inverse;
+                        }
+                        // rate is not "" and existing rate is ""?
+                        if (this.tempRates.hasOwnProperty(key) && rate !== '' && this.tempRates[key].rate === '') {
+                            this.tempRates[key].rate = rate;
+                        }
+
+                        if (!this.tempRates.hasOwnProperty(key)) {
+                            this.tempRates[key] = {
+                                key: key,
+                                date: date,
+                                date_formatted: format(date, this.$t('config.date_time_fns')),
+                                date_field: current.attributes.date.substring(0, 10),
+                                rate: rate,
+                                inverse: '',
+                            };
+                        }
+                    }
+                }
+                if (parseInt(response.data.meta.pagination.current_page) < parseInt(response.data.meta.pagination.total_pages)) {
+                    this.downloadRates(page + 1);
+                }
+                if (parseInt(response.data.meta.pagination.current_page) === parseInt(response.data.meta.pagination.total_pages)) {
+                    this.loading = false;
+                    this.rates = Object.values(this.tempRates);
+                }
+            });
+        }
+    },
+
 }
 
 </script>
diff --git a/resources/assets/v1/src/create_transaction.js b/resources/assets/v1/src/create_transaction.js
index 1dda1b3fd2..a5bb19dd7c 100644
--- a/resources/assets/v1/src/create_transaction.js
+++ b/resources/assets/v1/src/create_transaction.js
@@ -23,7 +23,7 @@ import CreateTransaction from './components/transactions/CreateTransaction';
 import CustomDate from "./components/transactions/CustomDate";
 import CustomString from "./components/transactions/CustomString";
 import CustomTextarea from "./components/transactions/CustomTextarea";
-import StandardDate from "./components/transactions/StandardDate";
+import  StandardDate from "./components/transactions/StandardDate";
 import GroupDescription from "./components/transactions/GroupDescription";
 import TransactionDescription from "./components/transactions/TransactionDescription";
 import CustomTransactionFields from "./components/transactions/CustomTransactionFields";
diff --git a/routes/api.php b/routes/api.php
index d5c3b0eec9..e0c649d9f0 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -114,7 +114,7 @@ Route::group(
     ],
     static function (): void {
         Route::get('', ['uses' => 'IndexController@index', 'as' => 'index']);
-        Route::get('{fromCurrencyCode}/{toCurrencyCode}', ['uses' => 'ShowController@show', 'as' => 'show']);
+        Route::get('rates/{fromCurrencyCode}/{toCurrencyCode}', ['uses' => 'ShowController@show', 'as' => 'show']);
 //        Route::post('', ['uses' => 'StoreController@store', 'as' => 'store']);
 //
         //        Route::put('{userGroup}', ['uses' => 'UpdateController@update', 'as' => 'update']);