From e9d5c31e76e6d00c31d846da11270bddcd9ededb Mon Sep 17 00:00:00 2001
From: mo4islona <mo4islona@gmail.com>
Date: Mon, 10 Apr 2023 12:09:08 +0400
Subject: [PATCH] fix: make content scrollable

---
 src/commands/deploy.ts                  | 12 +-----------
 src/ui/components/Tabs.ts               |  1 +
 src/ui/components/VersionDbAccessTab.ts |  5 ++++-
 src/ui/components/VersionLogsTab.ts     |  4 ++--
 src/ui/components/VersionSummaryTab.ts  |  5 ++++-
 src/ui/theme/index.ts                   | 10 ++++++++++
 6 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/src/commands/deploy.ts b/src/commands/deploy.ts
index e28fb4e..eb3e4ad 100644
--- a/src/commands/deploy.ts
+++ b/src/commands/deploy.ts
@@ -8,19 +8,9 @@ import inquirer from 'inquirer';
 import yaml from 'js-yaml';
 import targz from 'targz';
 
-import {
-  DeployResponse,
-  deploySquid,
-  DeployStatus,
-  getDeploy,
-  isVersionExists,
-  streamSquidLogs,
-  uploadFile,
-} from '../api';
-import { CliCommand } from '../command';
+import { deploySquid, isVersionExists, uploadFile } from '../api';
 import { DeployCommand } from '../deploy-command';
 import { Manifest } from '../manifest';
-import { doUntil } from '../utils';
 
 const compressAsync = promisify(targz.compress);
 
diff --git a/src/ui/components/Tabs.ts b/src/ui/components/Tabs.ts
index 027ee9a..c0668a9 100644
--- a/src/ui/components/Tabs.ts
+++ b/src/ui/components/Tabs.ts
@@ -72,6 +72,7 @@ export class Tabs extends Element {
 
       autoCommandKeys: false,
       keys: true,
+      mouse: true,
 
       style: {
         item: {
diff --git a/src/ui/components/VersionDbAccessTab.ts b/src/ui/components/VersionDbAccessTab.ts
index 75b0a14..33d3288 100644
--- a/src/ui/components/VersionDbAccessTab.ts
+++ b/src/ui/components/VersionDbAccessTab.ts
@@ -1,7 +1,7 @@
 import chalk from 'chalk';
 import blessed, { Element } from 'reblessed';
 
-import { chalkMainColor } from '../theme';
+import { chalkMainColor, scrollBarTheme } from '../theme';
 
 import { VersionTab } from './Tabs';
 import { SquidVersion } from './types';
@@ -38,6 +38,9 @@ export class VersionDbAccessTab implements VersionTab {
     parent.append(
       blessed.box({
         content: lines.join('\n'),
+        scrollable: true,
+        mouse: true,
+        scrollbar: scrollBarTheme,
       }),
     );
   }
diff --git a/src/ui/components/VersionLogsTab.ts b/src/ui/components/VersionLogsTab.ts
index a963f95..a9a5fb6 100644
--- a/src/ui/components/VersionLogsTab.ts
+++ b/src/ui/components/VersionLogsTab.ts
@@ -3,7 +3,7 @@ import blessed, { Element, List, Log } from 'reblessed';
 
 import { streamSquidLogs, versionHistoryLogs } from '../../api';
 import { pretty } from '../../logs';
-import { mainColor } from '../theme';
+import { mainColor, scrollBarTheme } from '../theme';
 
 import { Loader } from './Loader';
 import { VersionTab } from './Tabs';
@@ -17,7 +17,7 @@ export class VersionLogTab implements VersionTab {
       width: '100%',
       height: '100%',
       scrollable: true,
-      scrollbar: true,
+      scrollbar: scrollBarTheme,
       alwaysScroll: true,
       mouse: true,
       style: {
diff --git a/src/ui/components/VersionSummaryTab.ts b/src/ui/components/VersionSummaryTab.ts
index cb44c98..86a691e 100644
--- a/src/ui/components/VersionSummaryTab.ts
+++ b/src/ui/components/VersionSummaryTab.ts
@@ -2,7 +2,7 @@ import chalk from 'chalk';
 import bytes from 'pretty-bytes';
 import blessed, { Element } from 'reblessed';
 
-import { chalkMainColor } from '../theme';
+import { chalkMainColor, scrollBarTheme } from '../theme';
 
 import { VersionTab } from './Tabs';
 import { SquidVersion } from './types';
@@ -45,6 +45,9 @@ export class VersionSummaryTab implements VersionTab {
     parent.append(
       blessed.box({
         content: lines.join('\n'),
+        scrollable: true,
+        mouse: true,
+        scrollbar: scrollBarTheme,
       }),
     );
   }
diff --git a/src/ui/theme/index.ts b/src/ui/theme/index.ts
index 90d0186..ccc3fbb 100644
--- a/src/ui/theme/index.ts
+++ b/src/ui/theme/index.ts
@@ -2,6 +2,7 @@ import chalk from 'chalk';
 
 export const mainColor = 'blue';
 export const chalkMainColor = chalk.blue;
+export const mainLightColor = 'bright-blue';
 
 export const defaultBoxTheme = {
   tags: true,
@@ -19,3 +20,12 @@ export const defaultBoxTheme = {
     },
   },
 };
+
+export const scrollBarTheme = {
+  style: {
+    bg: mainLightColor,
+  },
+  track: {
+    bg: mainColor,
+  },
+};