From 3fd53cf9ce4f90b540c9965d6f733f544706d942 Mon Sep 17 00:00:00 2001
From: LY <51789698+Young-Lord@users.noreply.github.com>
Date: Sun, 6 Oct 2024 11:10:27 +0800
Subject: [PATCH] minor ui change
---
.env.development | 10 +--
frontend/src/components/SidebarDelimLine.vue | 19 ++++++
frontend/src/views/Clip.vue | 68 ++++++++++++++------
server/app/config.py | 1 -
4 files changed, 73 insertions(+), 25 deletions(-)
create mode 100644 frontend/src/components/SidebarDelimLine.vue
diff --git a/.env.development b/.env.development
index 4a24c0c..c6e1617 100644
--- a/.env.development
+++ b/.env.development
@@ -1,14 +1,16 @@
APP_SECRET=""
-FLASK_SERVER_NAME="localhost:5000"
+BIND_HOST="127.0.0.1"
+BIND_PORT="5001"
+FLASK_SERVER_NAME="localhost:${BIND_PORT}"
FLASK_APPLICATION_ROOT="/"
FLASK_PREFERRED_URL_SCHEME="http"
VITE_BASE_DOMAIN="http://localhost:53000"
VITE_BASE_PATH="" # example: "/service/clip"
-VITE_API_BASE_DOMAIN="http://localhost:5000"
+VITE_API_BASE_DOMAIN="http://localhost:${BIND_PORT}"
VITE_API_BASE_PATH="${VITE_BASE_PATH}"
CORS_ORIGINS="http://localhost:53000" # delim by single space
MAIL_SERVER="localhost"
-WEBSOCKET_ENDPOINT="ws://localhost:5000" # leave empty to disable; should NOT include path here, as it represents namespace ( https://socket.io/docs/v4/client-options/#path )
+WEBSOCKET_ENDPOINT="ws://localhost:${BIND_PORT}" # leave empty to disable; should NOT include path here, as it represents namespace ( https://socket.io/docs/v4/client-options/#path )
WEBSOCKET_PATH="/socket.io/"
WEBSOCKET_PATH_FOR_SERVER="${WEBSOCKET_PATH}" # should match with WEBSOCKET_PATH, except for the path removed by reverse proxy
BEHIND_REVERSE_PROXY="false"
@@ -16,6 +18,4 @@ BEHIND_REVERSE_PROXY="false"
# see: https://werkzeug.palletsprojects.com/en/latest/middleware/proxy_fix/#werkzeug.middleware.proxy_fix.ProxyFix
PROXYFIX_EXTRA_KWARGS='{}'
# e.g., {"x_prefix": 1, "x_host": 1} to make url_for work behind reverse proxy (like `URL Rewrite`)
-BIND_HOST="127.0.0.1"
-BIND_PORT="5000"
SQLALCHEMY_DATABASE_URI="sqlite:///main.db"
\ No newline at end of file
diff --git a/frontend/src/components/SidebarDelimLine.vue b/frontend/src/components/SidebarDelimLine.vue
new file mode 100644
index 0000000..78685b5
--- /dev/null
+++ b/frontend/src/components/SidebarDelimLine.vue
@@ -0,0 +1,19 @@
+
+
+
+
+
+
diff --git a/frontend/src/views/Clip.vue b/frontend/src/views/Clip.vue
index 46bb2f1..4a00994 100644
--- a/frontend/src/views/Clip.vue
+++ b/frontend/src/views/Clip.vue
@@ -115,6 +115,7 @@
v-model="selected_timeout"
:prepend-inner-icon="mdiClock"
v-if="!is_new && !is_readonly"
+ hide-details="auto"
>
@@ -126,6 +127,7 @@
@click="copyString(current_url)"
class="cursor-pointer"
v-if="!is_readonly"
+ hide-details="auto"
>
@@ -151,6 +153,7 @@
: mdiPlusCircleOutline
"
@click:append-inner.stop="toggleReadonlyUrl()"
+ hide-details="auto"
>
+
@@ -210,6 +215,7 @@
type="number"
@keyup="onUpdateSaveInterval()"
v-if="!is_readonly"
+ hide-details="auto"
>
@@ -220,6 +226,7 @@
dense
type="number"
@keyup="onUpdateFetchInterval()"
+ hide-details="auto"
>
@@ -228,16 +235,20 @@
:label="$t('clip.encrypt_content')"
v-if="!is_readonly"
@change="updateEncryptText()"
+ hide-details="auto"
>
+
+
-
-
- {{
- $t("clip.report.report_clip")
- }}
-
+
+
+
+ {{
+ $t("clip.report.report_clip")
+ }}
+
@@ -506,6 +520,7 @@ import {
mdiEye,
} from "@mdi/js"
import AppBarHomeButton from "@/components/AppBarHomeButton.vue"
+import SideBarDelimLine from "@/components/SidebarDelimLine.vue"
import { useDisplay } from "vuetify"
const { smAndUp } = useDisplay()
const should_wrap_appbar_to_slot = computed(() => {
@@ -640,7 +655,6 @@ function processFetchedFiles(files: FileDataRaw[]) {
file.user_property = JSON.parse(file.user_property)
file.filename = mayDecryptFilename(file as FileData)
})
- console.log(files)
remote_files.value = files as FileData[]
}
async function processFetchedContent(
@@ -937,9 +951,9 @@ function getTotalSize(...file_arrays: (File[] | FileData[])[]): number {
}
function arrayBufferToWordArray(ab: ArrayBuffer): WordArray {
// https://stackoverflow.com/questions/33914764/how-to-read-a-binary-file-with-filereader-in-order-to-hash-it-with-sha-256-in-cr
- var i8a = new Uint8Array(ab)
- var a = []
- for (var i = 0; i < i8a.length; i += 4) {
+ let i8a = new Uint8Array(ab)
+ let a = []
+ for (let i = 0; i < i8a.length; i += 4) {
a.push(
(i8a[i] << 24) | (i8a[i + 1] << 16) | (i8a[i + 2] << 8) | i8a[i + 3]
)
@@ -1108,10 +1122,10 @@ function canPreviewFile(file: FileData): boolean {
// Instant Sync
import { onBeforeRouteLeave } from "vue-router"
import type { io as ioType } from "socket.io-client"
-var io: null | typeof ioType = null
+let io: null | typeof ioType = null
import type { diff_match_patch as DiffMatchPatchType } from "@dmsnell/diff-match-patch"
type patch_obj = DiffMatchPatchType.patch_obj
-var diff_match_patch: null | DiffMatchPatchType = null
+let diff_match_patch: null | DiffMatchPatchType = null
const instant_sync_code_ready = ref(false)
watch(first_fetched, async (new_first_fetched, old_first_fetched) => {
if (new_first_fetched && !old_first_fetched) {
@@ -1531,20 +1545,36 @@ async function reportClip() {
}
/* remove useless padding in sidebar */
-#sidebar .v-input__details {
+/* #sidebar .v-input__details {
display: none;
-}
+} */
-#sidebar .v-list {
+/* #sidebar .v-list {
padding: 0;
+} */
+
+.v-select__selection-text {
+ /* make Expiration text pure black*/
+ color: #000000;
}
#sidebar .v-list-group__items .v-list-item {
+ /* fix indent for Report Clip */
padding-inline-start: 16px !important;
}
-/* add better padding in file card */
+#sidebar .v-input.v-checkbox {
+ /* make checkbox look better */
+ background-color: #f6f6f6;
+}
+
+/* Disable the tranisition animation when changing files. */
+/* .v-messages__message {
+ transition: none !important;
+} */
+
#file-card div.v-input__prepend {
+ /* add better padding in file card */
margin-inline-start: 16px !important;
margin-inline-end: 16px !important;
}
diff --git a/server/app/config.py b/server/app/config.py
index fc3a5a3..e3abe55 100644
--- a/server/app/config.py
+++ b/server/app/config.py
@@ -35,7 +35,6 @@ class Config:
)
# endpoint
- # check if a WSGI server is required. If not, remove unused imports & monkey patches
API_SUFFIX = "/api"
HOMEPAGE_URL: str = environ["VITE_HOMEPAGE_URL"]
API_URL: str = environ["VITE_API_URL"]