style: new key type selector align center on windows #166

Co-authored-by: raojinlin <raojinlin302@gmail.com>

.github/workflows/release-linux.yaml

@@ -3,6 +3,12 @@ name: Release Linux App
 on:
   release:
     types: [ published ]
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: 'Version tag'
+        required: true
+        default: '1.0.0'
 
 jobs:
   release:
@@ -27,8 +33,13 @@ jobs:
         id: normalise_version
         shell: bash
         run: |
-          version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+          if [ "${{ github.event.release.tag_name }}" == "" ]; then
-          echo "version=$version" >> "$GITHUB_OUTPUT"
+            version=$(echo ${{ github.event.inputs.tag }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          else
+            version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          fi
 
       - name: Setup Go
         uses: actions/setup-go@v4
@@ -65,7 +76,7 @@ jobs:
         shell: bash
         run: |
           CGO_ENABLED=1 wails build -platform ${{ matrix.platform }} \
-          -ldflags "-X main.version=${{ github.event.release.tag_name }} -X main.gaMeasurementID=${{ secrets.GA_MEASUREMENT_ID }} -X main.gaSecretKey=${{ secrets.LINUX_GA_SECRET }}" \
+          -ldflags "-X main.version=v${{ steps.normalise_version.outputs.version }} -X main.gaMeasurementID=${{ secrets.GA_MEASUREMENT_ID }} -X main.gaSecretKey=${{ secrets.LINUX_GA_SECRET }}" \
           -o tiny-rdm
 
       - name: Setup control template
@@ -105,5 +116,6 @@ jobs:
       - name: Upload release asset
         uses: softprops/action-gh-release@v1
         with:
+          tag_name: v${{ steps.normalise_version.outputs.version }}
           files: ./build/linux/tiny-rdm_${{ steps.normalise_version.outputs.version }}_${{ steps.normalise_platform.outputs.tag }}.deb
           token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release-macos.yaml

@@ -3,6 +3,12 @@ name: Release macOS App
 on:
   release:
     types: [ published ]
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: 'Version tag'
+        required: true
+        default: '1.0.0'
 
 jobs:
   release:
@@ -29,8 +35,13 @@ jobs:
         id: normalise_version
         shell: bash
         run: |
-          version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+          if [ "${{ github.event.release.tag_name }}" == "" ]; then
-          echo "version=$version" >> "$GITHUB_OUTPUT"
+            version=$(echo ${{ github.event.inputs.tag }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          else
+            version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          fi
 
       - name: Setup Go
         uses: actions/setup-go@v4
@@ -116,5 +127,6 @@ jobs:
       - name: Upload release asset (DMG Package)
         uses: softprops/action-gh-release@v1
         with:
+          tag_name: v${{ steps.normalise_version.outputs.version }}
           files: ./build/bin/TinyRDM_${{ steps.normalise_version.outputs.version }}_${{ steps.normalise_platform.outputs.tag }}.dmg
           token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release-windows.yaml

@@ -3,6 +3,12 @@ name: Release Windows App
 on:
   release:
     types: [ published ]
+  workflow_dispatch:
+    inputs:
+      tag:
+        description: 'Version tag'
+        required: true
+        default: '1.0.0'
 
 jobs:
   release:
@@ -25,16 +31,23 @@ jobs:
           echo "tag=$tag" >> "$GITHUB_OUTPUT"
 
       - name: Normalise platform name
-        id: platform_name
+        id: normalise_platform_name
         shell: bash
-        run: tag=$(echo ${{ matrix.platform }} | sed -e 's/\//_/g')
+        run: |
+          pname=$(echo ${{ matrix.platform }} | sed -e 's/\//_/g')
+          echo "pname=$pname" >> "$GITHUB_OUTPUT"
 
       - name: Normalise version tag
         id: normalise_version
         shell: bash
         run: |
-          version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+          if [ "${{ github.event.release.tag_name }}" == "" ]; then
-          echo "version=$version" >> "$GITHUB_OUTPUT"
+            version=$(echo ${{ github.event.inputs.tag }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          else
+            version=$(echo ${{ github.event.release.tag_name }} | sed -e 's/v//g')
+            echo "version=$version" >> "$GITHUB_OUTPUT"
+          fi
 
       - name: Setup Go
         uses: actions/setup-go@v4
@@ -71,7 +84,7 @@ jobs:
         run: |
           CGO_ENABLED=1 wails build -clean -platform ${{ matrix.platform }} \
           -webview2 embed \
-          -ldflags "-X main.version=${{ github.event.release.tag_name }} -X main.gaMeasurementID=${{ secrets.GA_MEASUREMENT_ID }} -X main.gaSecretKey=${{ secrets.WINDOWS_GA_SECRET }}"
+          -ldflags "-X main.version=v${{ steps.normalise_version.outputs.version }} -X main.gaMeasurementID=${{ secrets.GA_MEASUREMENT_ID }} -X main.gaSecretKey=${{ secrets.WINDOWS_GA_SECRET }}"
 
       - name: Compress portable binary
         working-directory: ./build/bin
@@ -80,6 +93,7 @@ jobs:
       - name: Upload release asset (Portable)
         uses: softprops/action-gh-release@v1
         with:
+          tag_name: v${{ steps.normalise_version.outputs.version }}
           files: ./build/bin/TinyRDM_Portable_${{ steps.normalise_version.outputs.version }}_${{ steps.normalise_platform.outputs.tag }}.zip
           token: ${{ secrets.GITHUB_TOKEN }}
 
@@ -88,7 +102,7 @@ jobs:
         run: |
           CGO_ENABLED=1 wails build -clean -platform ${{ matrix.platform }} \
           -nsis -webview2 embed \
-          -ldflags "-X main.version=${{ github.event.release.tag_name }}"
+          -ldflags "-X main.version=v${{ steps.normalise_version.outputs.version }}"
 
       - name: Codesign Windows NSIS installer
         working-directory: ./build/bin
@@ -98,7 +112,7 @@ jobs:
           Set-Content -Path certificate\certificate.txt -Value '${{ secrets.WIN_SIGNING_CERT }}'
           certutil -decode certificate\certificate.txt certificate\certificate.pfx
           echo "Signing TinyRDM installer"
-          & 'C:/Program Files (x86)/Windows Kits/10/bin/10.0.17763.0/x86/signtool.exe' sign /fd sha256 /tr http://ts.ssl.com /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' TinyRDM-${{ matrix.platform }}-installer.exe
+          & 'C:/Program Files (x86)/Windows Kits/10/bin/10.0.17763.0/x86/signtool.exe' sign /fd sha256 /tr http://ts.ssl.com /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' TinyRDM-${{ steps.normalise_platform_name.outputs.pname }}-installer.exe
 
       - name: Rename installer
         working-directory: ./build/bin
@@ -107,5 +121,6 @@ jobs:
       - name: Upload release asset (Installer)
         uses: softprops/action-gh-release@v1
         with:
+          tag_name: v${{ steps.normalise_version.outputs.version }}
           files: ./build/bin/TinyRDM_Setup_${{ steps.normalise_version.outputs.version }}_${{ steps.normalise_platform.outputs.tag }}.exe
           token: ${{ secrets.GITHUB_TOKEN }}

frontend/src/components/content_value/ContentEditor.vue

@@ -3,6 +3,7 @@ import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import * as monaco from 'monaco-editor'
 import usePreferencesStore from 'stores/preferences.js'
 import { useThemeVars } from 'naive-ui'
+import { isEmpty } from 'lodash'
 
 const props = defineProps({
     content: {
@@ -22,6 +23,14 @@ const props = defineProps({
         type: Boolean,
         default: false,
     },
+    offsetKey: {
+        type: String,
+        default: '',
+    },
+    keepOffset: {
+        type: Boolean,
+        default: false,
+    },
 })
 
 const emit = defineEmits(['reset', 'input', 'save'])
@@ -31,6 +40,18 @@ const themeVars = useThemeVars()
 const editorRef = ref(null)
 /** @type monaco.editor.IStandaloneCodeEditor */
 let editorNode = null
+const scrollOffset = { top: 0, left: 0 }
+
+const updateScroll = () => {
+    if (editorNode != null) {
+        if (props.keepOffset && !isEmpty(props.offsetKey)) {
+            editorNode.setScrollPosition({ scrollTop: scrollOffset.top, scrollLeft: scrollOffset.left })
+        } else {
+            // reset offset if not needed
+            editorNode.setScrollPosition({ scrollTop: 0, scrollLeft: 0 })
+        }
+    }
+}
 
 const destroyEditor = () => {
     if (editorNode != null && editorNode.dispose != null) {
@@ -88,6 +109,18 @@ onMounted(async () => {
             emit('save')
         })
 
+        editorNode.onDidScrollChange((event) => {
+            // save scroll offset when changes, ie. content changes
+            if (props.keepOffset && !event.scrollHeightChanged) {
+                scrollOffset.top = event.scrollTop
+                scrollOffset.left = event.scrollLeft
+            }
+        })
+
+        editorNode.onDidLayoutChange((event) => {
+            updateScroll()
+        })
+
         // editorNode.onDidChangeModelLanguageConfiguration(() => {
         //     editorNode?.getAction('editor.action.formatDocument')?.run()
         // })
@@ -106,6 +139,19 @@ watch(
         if (editorNode != null) {
             editorNode.setValue(content)
             await nextTick(() => emit('reset', content))
+            updateScroll()
+        }
+    },
+)
+
+watch(
+    () => props.offsetKey,
+    () => {
+        // reset scroll offset when key changed
+        if (editorNode != null) {
+            scrollOffset.top = 0
+            scrollOffset.left = 0
+            editorNode.setScrollPosition({ scrollTop: 0, scrollLeft: 0 })
         }
     },
 )

frontend/src/components/content_value/ContentEntryEditor.vue

@@ -175,6 +175,7 @@ const onSave = () => {
                         :border="true"
                         :content="displayValue"
                         :language="viewLanguage"
+                        :key-path="viewAs.field"
                         class="flex-item-expand"
                         @input="onInput"
                         @reset="onInput"

frontend/src/components/content_value/ContentValueJson.vue

@@ -149,6 +149,8 @@ defineExpose({
                 v-show="!props.loading"
                 :content="displayValue"
                 :loading="props.loading"
+                :offset-key="props.keyPath"
+                keep-offset
                 class="flex-item-expand"
                 language="json"
                 style="height: 100%"

frontend/src/components/content_value/ContentValueString.vue

@@ -204,6 +204,8 @@ defineExpose({
                 :content="displayValue"
                 :language="viewLanguage"
                 :loading="props.loading"
+                :offset-key="props.keyPath"
+                keep-offset
                 class="flex-item-expand"
                 style="height: 100%"
                 @input="onInput"

frontend/src/components/dialogs/NewKeyDialog.vue

@@ -93,7 +93,14 @@ watchEffect(() => {
 const renderTypeLabel = (option) => {
     return h(
         NSpace,
-        { align: 'center', inline: true, size: 3 },
+        {
+            align: 'center',
+            inline: true,
+            size: 3,
+            itemStyle: {
+                lineHeight: 'var(--n-blank-height)',
+            },
+        },
         {
             default: () => [
                 h('div', {