Merge branch 'main' into feature/spotlight/backend-sorting

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+node_modules/.bin/lint-staged

components/shared/Loader.vue

@@ -8,7 +8,7 @@
         <br />
         <div class="pl-4 pr-4">
           <b-icon size="is-large" icon="lightbulb" class="funfact-icon" />
-          <div>{{ randomFunFactQuestion }}</div>
+          <div class="question">{{ randomFunFactQuestion }}</div>
         </div>
       </div>
       <figure>
@@ -86,7 +86,6 @@ export default class Loader extends Vue {
   background: #1a1a1ae0;
   margin: 0rem 1rem;
   width: 450px;
-  height: 400px;
   border: 2px solid $primary-light;
   box-shadow: 13px 14px $primary-dark-transparent;
 }
@@ -106,6 +105,9 @@ export default class Loader extends Vue {
 .funfact-icon {
   color: $primary-light;
 }
+.question {
+  min-height: 70px;
+}
 .loading-text {
   position: relative;
   max-width: 200px;

components/shared/history/HistoryBrowser.vue

@@ -2,9 +2,7 @@
   <div v-show="history && history.length" class="history-browser">
     <b-dropdown
       aria-role="list"
-      scrollable
-      position="is-bottom-left"
-      max-height="400px">
+      position="is-bottom-left">
       <template #trigger>
         <b-button type="is-primary" icon-left="history" />
       </template>
@@ -102,10 +100,16 @@ export default class HistoryBrowser extends Vue {
 }
 .wrapper {
   border: 2px solid $primary;
+  max-height: 400px;
+  overflow: auto;
 }
 .list-header {
   padding: 10px 0 0 12px;
   font-size: 1.2rem;
   font-weight: bold;
+  position: sticky;
+  top: 0;
+  background: $black;
+  z-index: 1;
 }
 </style>

components/shared/history/HistoryBrowserItem.vue

@@ -68,6 +68,7 @@ export default class HistoryBrowserItem extends Vue {
 @media screen and (min-width: 1024px) {
   .item {
     width: 400px;
+    transition: 0.6s;
   }
   .item button {
     display: none;

components/spotlight/SpotlightDetail.vue

@@ -9,8 +9,9 @@
 </template>
 
 <script lang="ts">
-import { Component, Prop, Vue, Watch } from 'nuxt-property-decorator'
+import { Component, Prop, mixins, Watch } from 'nuxt-property-decorator'
 import shouldUpdate from '@/utils/shouldUpdate'
+import PrefixMixin from '@/utils/mixins/prefixMixin'
 import nftSimpleListByAccount from '@/queries/nftSimpleListByAccount.graphql'
 
 const components = {
@@ -24,7 +25,7 @@ type NftSimpleView = {
 }
 
 @Component({ components })
-export default class SpotlightDetail extends Vue {
+export default class SpotlightDetail extends mixins(PrefixMixin) {
   @Prop(String) public account!: string
   protected nfts: NftSimpleView[] = []
   protected isLoading = true

package.json

@@ -13,7 +13,21 @@
     "generate": "nuxt generate",
     "lint": "eslint --ignore-path .gitignore --ext .js,.ts,.vue .",
     "lint:quiet": "eslint --quiet --ignore-path .gitignore --ext .js,.ts,.vue .",
-    "test": "jest --verbose ./tests"
+    "lint:fix": "eslint --fix --quiet --ignore-path .gitignore --ext .js,.ts,.vue .",
+    "test": "jest --verbose ./tests",
+    "prepare": "husky install"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "*.{js,ts,vue,json,css,scss,md}": [
+      "prettier --write",
+      "yarn lint",
+      "git add"
+    ]
   },
   "engines": {
     "node": ">=16"
@@ -47,8 +61,8 @@
     "chartjs-adapter-luxon": "^1.1.0",
     "chartjs-plugin-annotation": "^1.2.1",
     "chartjs-plugin-zoom": "^1.1.1",
-    "css-loader": "4.3.0",
     "core-js": "^3.20.1",
+    "css-loader": "4.3.0",
     "date-fns": "^2.25.0",
     "emoji-unicode": "^2.0.1",
     "file-saver": "^2.0.5",
@@ -111,7 +125,9 @@
     "eslint": "^8.4.1",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-vue": "^8.2.0",
+    "husky": "^7.0.0",
     "jest": "^27.4.7",
+    "lint-staged": "^12.1.7",
     "netlify-lambda": "^2.0.14",
     "prettier": "2.5.1",
     "sass": "^1.42.1",

pages/teleport.vue

@@ -324,10 +324,10 @@ export default class Transfer extends mixins(
     )
   }
 
-  protected getExplorerUrl(): void {
-    const url = this.getUrl()
-    window.open(url, '_blank')
-  }
+    protected getExplorerUrl(): void {
+        const url = this.getUrl()
+        window.open(url, '_blank')
+    }
 
   protected generatePaymentLink(): string {
     return `${window.location.origin}/transfer?target=${this.destinationAddress}&usdamount=${this.usdValue}&donation=true`

static/_headers

@@ -0,0 +1,8 @@
+/*
+  X-Frame-Options: DENY
+  X-XSS-Protection: 1; mode=block
+  X-Content-Type-Options: nosniff
+  Referrer-Policy: strict-origin-when-cross-origin
+  Content-Security-Policy: frame-ancestors 'self';
+  Strict-Transport-Security: max-age=31536000; includeSubDomains
+  Permissions-Policy: accelerometer=*, autoplay=*, camera=*, geolocation=*, gyroscope=*, microphone=*