Merge pull request #66 from constantine2nd/develop

Few tweaks
OpenBankProject · Nov 8, 2024 · 72955e7 · 72955e7
2 parents 49278a8 + 15f9a3f
commit 72955e7
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 9 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,6 @@
 {
   "name": "api-explorer",
-  "version": "1.0.20",
-  "type": "module",
+  "version": "1.0.21",
   "private": true,
   "scripts": {
     "dev": "vite & ts-node server/app.ts",
@@ -19,6 +18,7 @@
     "@fontsource/roboto": "^5.0.0",
     "@highlightjs/vue-plugin": "^2.1.0",
     "axios": "^1.7.2",
+    "cheerio": "^1.0.0",
     "class-transformer": "^0.5.1",
     "class-validator": "^0.14.0",
     "connect-redis": "^7.1.1",

diff --git a/server/app.ts b/server/app.ts
@@ -44,15 +44,25 @@ process.env.VITE_OBP_REDIS_URL
   ? console.log(`VITE_OBP_REDIS_URL: ${process.env.VITE_OBP_REDIS_URL}`)
   : console.log(`VITE_OBP_REDIS_URL: undefined connects to localhost on port 6379`)
 
-const redisPassword = process.env.VITE_OBP_REDIS_PASSWORD 
+const redisPassword = process.env.VITE_OBP_REDIS_PASSWORD
   ? process.env.VITE_OBP_REDIS_PASSWORD // Redis instance is protected with a password
   : '' // Specify an empty password (i.e., no password) when connecting to Redis
-if(!redisPassword) {
+if (!redisPassword) {
   console.warn(`VITE_OBP_REDIS_PASSWORD is not provided.`)
 }
+const redisUsername = process.env.VITE_OBP_REDIS_USERNAME
+  ? process.env.VITE_OBP_REDIS_USERNAME // Redis instance is protected with a username/password
+  : '' // Specify an empty username (i.e., no username) when connecting to Redis
+if (!redisUsername) {
+  console.warn(`VITE_OBP_REDIS_USERNAME is not provided.`)
+}
 console.log(`-----------------------------------------------------------------`)
 const redisClient = process.env.VITE_OBP_REDIS_URL
-  ? createClient({ url: process.env.VITE_OBP_REDIS_URL, password: redisPassword })
+  ? createClient({
+      url: process.env.VITE_OBP_REDIS_URL,
+      username: redisUsername,
+      password: redisPassword
+    })
   : createClient()
 redisClient.connect().catch(console.error)
 

diff --git a/src/components/Preview.vue b/src/components/Preview.vue
@@ -29,9 +29,10 @@
 import { ref, reactive, inject, onBeforeMount } from 'vue'
 import { onBeforeRouteUpdate, useRoute } from 'vue-router'
 import { getOperationDetails } from '../obp/resource-docs'
-import type { ElNotification, FormInstance } from 'element-plus'
+import { ElNotification, FormInstance } from 'element-plus'
 import { OBP_API_VERSION, get, create, update, discard, createEntitlement, getCurrentUser } from '../obp'
 import { obpResourceDocsKey } from '@/obp/keys'
+import * as cheerio from 'cheerio'
 
 const elMessageDuration = 5500
 const configVersion = 'OBP' + OBP_API_VERSION
@@ -77,7 +78,7 @@ const setOperationDetails = (id: string, version: string): void => {
   showRequiredRoles.value = requiredRoles.value.length > 0
   showValidations.value = validations.value.length > 0
   showPossibleErrors.value = possibleErrors.value.length > 0
-  showConnectorMethods.value = connectorMethods.value.length > 0
+  showConnectorMethods.value = true
   footNote.value.version = operation.operation_id
   footNote.value.version = operation.implemented_by.version
   footNote.value.functionName = operation.implemented_by.function
@@ -202,6 +203,39 @@ onBeforeRouteUpdate((to) => {
   responseHeaderTitle.value = 'TYPICAL SUCCESSFUL RESPONSE'
   setRoleForm()
 })
+
+const copyToClipboard = () => {
+  // Create a temporary text area to hold the content
+  const textArea = document.createElement('textarea');
+
+  // Parse the HTML content with Cheerio
+  const $ = cheerio.load(successResponseBody.value);
+
+  // Extract all JSON lines
+  const jsonLines: string[] = [];
+  $('.hljs-ln-code').each((_, element) => {
+      jsonLines.push($(element).text());
+  });
+
+  // Combine lines to form raw JSON
+  const rawJson = jsonLines.join('\n');
+  console.log(rawJson);
+
+  textArea.value = rawJson; // Set the text to copy
+  document.body.appendChild(textArea); // Append the text area to the DOM
+  textArea.select(); // Select the text inside the text area
+  document.execCommand('copy'); // Execute the copy command
+  document.body.removeChild(textArea); // Remove the text area from the DOM
+
+  // Show feedback to the user
+  ElNotification({
+    message: 'Response copied to clipboard!',
+    type: 'success',
+    duration: elMessageDuration
+  });
+};
+
+
 </script>
 
 <template>
@@ -231,8 +265,10 @@ onBeforeRouteUpdate((to) => {
     </div>
     <div v-show="successResponseBody">
       <pre>
-        {{responseHeaderTitle}}:
-        <code><div id="code" v-html="successResponseBody"></div></code>
+        {{ responseHeaderTitle }}:
+        <code>
+          <div @click="copyToClipboard" id="code" v-html="successResponseBody"></div>
+        </code>
       </pre>
     </div>
     <el-form ref="roleFormRef" :model="roleForm">