Merge pull request #2550 from threefoldtech/development_export_manual…

…_links Export manual links in a separate file
threefoldtech · Apr 14, 2024 · d8050a1 · d8050a1
2 parents f1e3728 + 3646f8b
commit d8050a1
Show file tree

Hide file tree

Showing 32 changed files with 114 additions and 173 deletions.
diff --git a/packages/playground/src/calculator/pricing_calculator.vue b/packages/playground/src/calculator/pricing_calculator.vue
@@ -8,13 +8,8 @@
       <VCardText>
         <VContainer fluid>
           <VAlert type="info" class="mb-10">
-            For more information about Threefold Pricing check
-            <a
-              class="app-link"
-              target="_blank"
-              href="https://manual.grid.tf/wiki/cloudunits/pricing/pricing.html#cloud-unit-pricing"
-              v-text="'here'"
-            />
+            For more information about Threefold Pricing check,
+            <a class="app-link" target="_blank" :href="manual.pricing" v-text="'Cloud Unit Pricing'" />
           </VAlert>
 
           <VForm
@@ -189,6 +184,8 @@ import { computed, ref } from "vue";
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 import type { VForm } from "vuetify/components/VForm";
 
+import { manual } from "@/utils/manual";
+
 import { calculator as Calculator } from "../../../grid_client/dist/es6";
 import { useProfileManagerController } from "../components/profile_manager_controller.vue";
 import { useAsync } from "../hooks";
@@ -289,6 +286,7 @@ export default {
       computePackageColor,
       normalizeError,
       profileManager,
+      manual,
     };
   },
 };

diff --git a/packages/playground/src/components/caprover_worker.vue b/packages/playground/src/components/caprover_worker.vue
@@ -24,11 +24,7 @@
     />
     <Networks v-model:mycelium="$props.modelValue.mycelium" />
 
-    <input-tooltip
-      inline
-      tooltip="Click to know more about dedicated machines."
-      :href="`${MANUAL_URL}/documentation/dashboard/deploy/dedicated_machines.html`"
-    >
+    <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
       <v-switch color="primary" inset label="Dedicated" v-model="$props.modelValue.dedicated" />
     </input-tooltip>
     <input-tooltip inline tooltip="Renting capacity on certified nodes is charged 25% extra.">
@@ -53,6 +49,8 @@
 <script lang="ts">
 import { computed, type PropType } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import Networks from "../components/networks.vue";
 import type { CaproverWorker } from "../types";
 import rootFs from "../utils/root_fs";
@@ -73,7 +71,7 @@ export default {
       return rootFs(cpu, memory);
     });
 
-    return { rootFilesystemSize };
+    return { rootFilesystemSize, manual };
   },
 };
 </script>
diff --git a/packages/playground/src/components/deposit_dialog.vue b/packages/playground/src/components/deposit_dialog.vue
@@ -67,13 +67,7 @@
           </v-container>
           <v-card-actions class="justify-end">
             <v-btn variant="outlined" color="anchor" class="mr-2 px-3" @click="closeDialog"> Close </v-btn>
-            <v-btn
-              variant="outlined"
-              color="secondary"
-              :href="`${MANUAL_URL}/documentation/threefold_token/tft_bridges/tft_bridges.html`"
-              target="_blank"
-              text="Learn more?"
-            />
+            <v-btn variant="outlined" color="secondary" :href="manual.tft_bridges" target="_blank" text="Learn more?" />
           </v-card-actions>
         </v-card-text>
       </v-card>
@@ -85,6 +79,8 @@
 import { Decimal } from "decimal.js";
 import { computed, onBeforeUnmount, onMounted, ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import { useProfileManagerController } from "../components/profile_manager_controller.vue";
 import QrcodeGenerator from "../components/qrcode_generator.vue";
 import { useProfileManager } from "../stores";

diff --git a/packages/playground/src/components/funds_card.vue b/packages/playground/src/components/funds_card.vue
@@ -17,12 +17,7 @@
     <div>
       Get TFT on Stellar using BTC or Credit card, then you can bridge it to your tfchain account using the Bridge in
       the dashboard section.
-      <v-btn
-        icon
-        small
-        @click.stop
-        :href="`${MANUAL_URL}/documentation/threefold_token/buy_sell_tft/buy_sell_tft.html`"
-        target="_blank"
+      <v-btn icon small @click.stop :href="manual.buy_sell_tft" target="_blank"
         ><v-icon>mdi-information-outline</v-icon></v-btn
       >
     </div>
@@ -32,6 +27,8 @@
 <script lang="ts">
 import { ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import { useProfileManagerController } from "../components/profile_manager_controller.vue";
 import { useProfileManager } from "../stores";
 import { createCustomToast, ToastType } from "../utils/custom_toast";
@@ -63,6 +60,7 @@ export default {
     };
     return {
       loadingAddTFT,
+      manual,
       addTFT,
     };
   },

diff --git a/packages/playground/src/components/k8s_worker.vue b/packages/playground/src/components/k8s_worker.vue
@@ -75,11 +75,7 @@
       v-model.number="$props.modelValue.rootFsSize"
     />
 
-    <input-tooltip
-      inline
-      tooltip="Click to know more about dedicated machines."
-      :href="`${MANUAL_URL}/documentation/dashboard/deploy/dedicated_machines.html`"
-    >
+    <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
       <v-switch color="primary" inset label="Dedicated" v-model="$props.modelValue.dedicated" />
     </input-tooltip>
 
@@ -109,6 +105,8 @@
 <script lang="ts">
 import type { PropType } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import Networks from "../components/networks.vue";
 import type { K8SWorker } from "../types";
 import rootFs from "../utils/root_fs";
@@ -142,7 +140,7 @@ export default {
     },
   },
   setup() {
-    return { rootFs };
+    return { rootFs, manual };
   },
 };
 </script>
diff --git a/packages/playground/src/components/main_footer.vue b/packages/playground/src/components/main_footer.vue
@@ -34,29 +34,15 @@
         <v-col class="mb-2" cols="12" sm="3" md="2">
           <p class="text-subtitle-1 footer_header" color="secondary">Take Action</p>
           <div>
-            <a
-              color="error"
-              :href="`${MANUAL_URL}/documentation/threefold_token/buy_sell_tft/buy_sell_tft.html`"
-              class="app-link text-subtitle-2"
-              target="_blank"
+            <a color="error" :href="manual.buy_sell_tft" class="app-link text-subtitle-2" target="_blank"
               >Buy the Token</a
             >
           </div>
           <div>
-            <a
-              :href="`${MANUAL_URL}/documentation/farmers/farmers.html`"
-              class="app-link text-subtitle-2"
-              target="_blank"
-              >Start Farming</a
-            >
+            <a :href="manual.farmers" class="app-link text-subtitle-2" target="_blank">Start Farming</a>
           </div>
           <div>
-            <a
-              :href="`${MANUAL_URL}/knowledge_base/about/governance.html`"
-              class="app-link text-subtitle-2"
-              target="_blank"
-              >Governance</a
-            >
+            <a :href="manual.governance" class="app-link text-subtitle-2" target="_blank">Governance</a>
           </div>
         </v-col>
         <v-col class="mx-3 mb-3" cols="12" sm="3" md="2">
@@ -107,6 +93,7 @@ import { useTheme } from "vuetify";
 
 import { DashboardRoutes } from "@/router/routes";
 import { AppThemeSelection } from "@/utils/app_theme";
+import { manual } from "@/utils/manual";
 
 const theme = useTheme();
 

diff --git a/packages/playground/src/components/weblet_layout.vue b/packages/playground/src/components/weblet_layout.vue
@@ -85,7 +85,7 @@
           </div>
         </div>
 
-        <a :href="`${MANUAL_URL}/knowledge_base/cloud/pricing/pricing.html`" target="_blank" class="app-link">
+        <a :href="manual.pricing" target="_blank" class="app-link">
           Learn more about the pricing and how to unlock discounts.
         </a>
       </v-alert>
@@ -112,6 +112,8 @@ import { events, type GridClient, type NodeInfo } from "@threefold/grid_client";
 import debounce from "lodash/debounce.js";
 import { computed, ref, watch } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import { useProfileManager } from "../stores";
 import { getGrid, loadBalance } from "../utils/grid";
 import { normalizeBalance } from "../utils/helpers";

diff --git a/packages/playground/src/config.ts b/packages/playground/src/config.ts
@@ -68,5 +68,3 @@ function defineGlobalProps(app: App<Element>) {
   app.config.globalProperties.validators = validators;
   app.config.globalProperties.MANUAL_URL = window.env.MANUAL_URL;
 }
-
-export const MANUAL_URL = window.env.MANUAL_URL;
diff --git a/packages/playground/src/dashboard/bridge_view.vue b/packages/playground/src/dashboard/bridge_view.vue
@@ -83,14 +83,14 @@ onMounted(async () => {
 });
 
 function navigation() {
-  window.open(`${MANUAL_URL}/documentation/threefold_token/tft_bridges/tfchain_stellar_bridge.html`, "_blank");
+  window.open(manual.tfchain_stellar_bridge, "_blank");
 }
 </script>
 
 <script lang="ts">
 import DepositDialog from "@/components/deposit_dialog.vue";
 import WithdrawDialog from "@/components/withdraw_dialog.vue";
-import { MANUAL_URL } from "@/config";
+import { manual } from "@/utils/manual";
 
 export default {
   name: "Bridge",

diff --git a/packages/playground/src/dashboard/components/dedicated_nodes_table.vue b/packages/playground/src/dashboard/components/dedicated_nodes_table.vue
@@ -43,17 +43,12 @@
                 <li>
                   {{ activeTab == 1 ? "You receive " : "You'll receive " }} 50% discount
                   {{ activeTab == 1 ? " as you reserve the " : " if you reserve an " }} entire
-                  <a target="_blank" :href="`${MANUAL_URL}/dashboard/deploy/dedicated_machines.html#billing--pricing`">
-                    node
-                  </a>
+                  <a target="_blank" :href="manual.billing_pricing"> node </a>
                 </li>
                 <li>
                   {{ activeTab == 1 ? "You're receiving " : "You'll be receiving " }} {{ item.raw.discount }}% discount
                   as per the
-                  <a
-                    target="_blank"
-                    :href="`${MANUAL_URL}/wiki/cloudunits/pricing/staking_discount_levels.html#staking-discount-levels`"
-                  >
+                  <a target="_blank" :href="manual.discount_levels">
                     <p style="display: inline">staking discounts</p>
                   </a>
                 </li>
@@ -171,6 +166,7 @@ import { VDataTableServer } from "vuetify/labs/VDataTable";
 
 import type { FilterOptions } from "@/types";
 import formatResourceSize from "@/utils/format_resource_size";
+import { manual } from "@/utils/manual";
 
 import NodeDetails from "./node_details.vue";
 import ReserveBtn from "./reserve_action_btn.vue";

diff --git a/packages/playground/src/dashboard/dao_view.vue b/packages/playground/src/dashboard/dao_view.vue
@@ -225,7 +225,7 @@
               <span>
                 If the vote count is insufficient and the time limit is reached, the proposal will be rejected.
               </span>
-              <a :href="`${MANUAL_URL}/documentation/dashboard/tfchain/tf_dao.html`" target="_blank">How to vote?</a>
+              <a :href="manual.dao" target="_blank">How to vote?</a>
               <br />
               <br />
               <h3>How do we count weight:</h3>
@@ -259,6 +259,8 @@ import type moment from "moment";
 import { createToast } from "mosha-vue-toastify";
 import { onMounted, ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import { useProfileManager } from "../stores";
 import type { FarmInterface } from "../types";
 import { getFarms } from "../utils/get_farms";

diff --git a/packages/playground/src/dashboard/twin_view.vue b/packages/playground/src/dashboard/twin_view.vue
@@ -147,13 +147,7 @@
             <div class="text-center my-3">
               <p>
                 Scan the QR code using
-                <a
-                  class="app-link"
-                  :href="`${MANUAL_URL}/documentation/threefold_token/storing_tft/tf_connect_app.html`"
-                  target="_blank"
-                >
-                  ThreeFold Connect
-                </a>
+                <a class="app-link" :href="manual.tf_connect_app" target="_blank"> ThreeFold Connect </a>
                 to fund your account
               </p>
             </div>
@@ -188,6 +182,8 @@
 import { generatePublicKey } from "@threefold/rmb_direct_client";
 import { onMounted, ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import router from "../router";
 import { useProfileManager } from "../stores";
 import type { FarmInterface } from "../types";

diff --git a/packages/playground/src/utils/manual.ts b/packages/playground/src/utils/manual.ts
@@ -0,0 +1,17 @@
+const BASE = window.env.MANUAL_URL;
+
+export const manual = {
+  dedicated_machines: `${BASE}/documentation/dashboard/deploy/dedicated_machines.html`,
+  tft_bridges: `${BASE}/documentation/threefold_token/tft_bridges/tft_bridges.html`,
+  buy_sell_tft: `${BASE}/documentation/threefold_token/buy_sell_tft/buy_sell_tft.html`,
+  farmers: `${BASE}/documentation/farmers/farmers.html`,
+  governance: `${BASE}/knowledge_base/about/governance.html`,
+  pricing: `${BASE}/knowledge_base/cloud/pricing/pricing.html`,
+  dao: `${BASE}/documentation/dashboard/tfchain/tf_dao.html`,
+  caprover: `${BASE}/documentation/dashboard/solutions/caprover.html`,
+  tf_connect_app: `${BASE}/documentation/threefold_token/storing_tft/tf_connect_app.html`,
+  contract_locking: `${BASE}/documentation/developers/tfchain/tfchain.html#contract-locking`,
+  billing_pricing: `${BASE}/dashboard/deploy/dedicated_machines.html#billing--pricing`,
+  discount_levels: `${BASE}/wiki/cloudunits/pricing/staking_discount_levels.html#staking-discount-levels`,
+  tfchain_stellar_bridge: `${BASE}/documentation/threefold_token/tft_bridges/tfchain_stellar_bridge.html`,
+};
diff --git a/packages/playground/src/weblets/freeflow.vue b/packages/playground/src/weblets/freeflow.vue
@@ -48,11 +48,7 @@
 
       <Networks v-model:ipv4="ipv4"></Networks>
 
-      <input-tooltip
-        inline
-        tooltip="Click to know more about dedicated machines."
-        :href="`${MANUAL_URL}/documentation/dashboard/deploy/dedicated_machines.html`"
-      >
+      <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
         <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
       </input-tooltip>
 
@@ -88,6 +84,8 @@
 import type { GridClient } from "@threefold/grid_client";
 import { computed, onMounted, type Ref, ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import { useLayout } from "../components/weblet_layout.vue";
 import { useProfileManager } from "../stores";
 import type { Flist, solutionFlavor as SolutionFlavor } from "../types";

diff --git a/packages/playground/src/weblets/full_vm.vue b/packages/playground/src/weblets/full_vm.vue
@@ -63,11 +63,7 @@
         >
           <v-switch color="primary" inset label="GPU" v-model="hasGPU" hide-details />
         </input-tooltip>
-        <input-tooltip
-          inline
-          tooltip="Click to know more about dedicated machines."
-          :href="`${MANUAL_URL}/documentation/dashboard/deploy/dedicated_machines.html`"
-        >
+        <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
           <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
         </input-tooltip>
 
@@ -147,6 +143,8 @@
 <script lang="ts" setup>
 import { type Ref, ref, watch } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import Network from "../components/networks.vue";
 import { useLayout } from "../components/weblet_layout.vue";
 import { useProfileManager } from "../stores";

diff --git a/packages/playground/src/weblets/micro_vm.vue b/packages/playground/src/weblets/micro_vm.vue
@@ -56,11 +56,7 @@
           v-model:wireguard="wireguard"
           ref="network"
         />
-        <input-tooltip
-          inline
-          tooltip="Click to know more about dedicated machines."
-          :href="`${MANUAL_URL}/documentation/dashboard/deploy/dedicated_machines.html`"
-        >
+        <input-tooltip inline tooltip="Click to know more about dedicated machines." :href="manual.dedicated_machines">
           <v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
         </input-tooltip>
 
@@ -188,6 +184,8 @@
 <script lang="ts" setup>
 import { computed, type Ref, ref } from "vue";
 
+import { manual } from "@/utils/manual";
+
 import Network from "../components/networks.vue";
 import SelectSolutionFlavor from "../components/select_solution_flavor.vue";
 import { useLayout } from "../components/weblet_layout.vue";