better TS + lint

Author: davay42

Diff for: .eslintrc

@@ -16,7 +16,14 @@
         {
             "files": ["composables/*", "components/*", "app/*", "relay/*"],
             "excludedFiles": ["**/dist/*", "**/_dist/*"]
-        }
+        },
+        {
+			// enable the rule specifically for TypeScript files
+			"files": ["*.ts", "*.tsx"],
+			"parserOptions": {
+				"parser": "@typescript-eslint/parser"
+			}
+		}
     ],
     "parserOptions": {
         "ecmaVersion": "latest",
@@ -28,6 +35,9 @@
     ],
     "rules": {
         "no-unused-vars": 0,
-        "vue/multi-word-component-names": 0
+        "vue/multi-word-component-names": 0,
+        "@typescript-eslint/ban-ts-comment": {
+            "ts-ignore": "allow-with-description"
+        }
     }
 }

Diff for: .npmrc

@@ -1 +1,2 @@
-strict-peer-dependencies=false
+strict-peer-dependencies=false
+shamefully-hoist=true

Diff for: app/jsconfig.json renamed to app/tsconfig.json

@@ -1,9 +1,9 @@
 {
 	"compilerOptions": {
-		"target": "ESNext",
+		"target": "ES2020",
 		"lib": ["DOM", "DOM.Iterable", "ESNext"],
 		"allowJs": true,
-		"skipLibCheck": false,
+		"skipLibCheck": true,
 		"esModuleInterop": false,
 		"allowSyntheticDefaultImports": true,
 		"strict": true,
@@ -14,7 +14,6 @@
 		"isolatedModules": true,
 		"noEmit": true,
 		"baseUrl": "./",
-		"jsx": "preserve",
 		"paths": {
 			"#composables": ["../composables/src/"],
 		}

Diff for: components/src/docs/Composables.story.vue

@@ -145,16 +145,6 @@ This should prevent any Gun-Vue related code from running during build stage.
         <td><p>Read and write zip files</p>
 </td>
       </tr>
-<tr>
-        <td><a href="#userelay">useRelay</a></td>
-        <td><p>Relay connection management</p>
-</td>
-      </tr>
-<tr>
-        <td><a href="#userelays">useRelays</a></td>
-        <td><p>Loads the <a href="https://github.com/amark/gun/wiki/volunteer.dht">list of active volunteer DHT gun nodes</a>  and benchmarks ping for them</p>
-</td>
-      </tr>
 <tr>
         <td><a href="#useworker">useWorker</a></td>
         <td><p>Worker wrapper for heavy functions</p>
@@ -502,118 +492,6 @@ Zips the whole post object
 | addFile | <code>function</code> | add a binary file to the zip |
 | downloadZip | <code>function</code> | initiate the download of the zip file |
 
-<hr />
-
-  <a name="module_useRelay"></a>
-
-## useRelay
-Relay connection management
-
-  
-* [useRelay](#module_useRelay)
-    * _static_
-        * [.useRelay()](#module_useRelay.useRelay) ⇒ <code>useRelay</code>
-    * _inner_
-        * [~Relay](#module_useRelay..Relay) : <code>reactive</code>
-
-### useRelay() ⇒ <code>useRelay</code>
-  Peer server status monitor
-
-**Example**  
-```js
-import { useRelay } from '@gun-vue/composables';
-
-const { relay, setPeer, resetPeer } = useRelay()
-```
-### Relay : <code>reactive</code>
-  Peer server status reactive object
-
-**Properties**
-
-| Name | Type | Description |
-| --- | --- | --- |
-| host | <code>String</code> | the current peer server URL |
-| status | <code>String</code> | current connection status |
-| started | <code>Number</code> | the timestamp of server started current session |
-| pulse | <code>Number</code> | last received timestamp |
-| lag | <code>Number</code> | drift of the timestamp in ms |
-| diff | <code>Number</code> | age of the session in ms |
-| age | <code>String</code> | age of the session in human readable format |
-| blink | <code>Boolean</code> | a Boolean toggled every time the new pulse comes to drive animations |
-
-**Example**  
-```js
-{
-"peer": "https://etogun.glitch.me/gun",
-"host": "6db1edbb5aae",
-"status": "running",
-"started": 1642666725795,
-"pulse": 1642677007483,
-"lag": 8,
-"diff": 10281688,
-"age": "3h",
-"delay": 22,
-"blink": true
-}
-```
-<hr />
-
-  <a name="module_useRelays"></a>
-
-## useRelays
-Loads the [list of active volunteer DHT gun nodes](https://github.com/amark/gun/wiki/volunteer.dht)  and benchmarks ping for them
-
-  
-* [useRelays](#module_useRelays)
-    * _static_
-        * [.loadRelays(loadRelaysOptions)](#module_useRelays.loadRelays) ⇒ <code>relays</code>
-        * [.useRelays()](#module_useRelays.useRelays) ⇒ <code>useRelays</code>
-    * _inner_
-        * [~useRelays](#module_useRelays..useRelays) : <code>Object</code>
-        * [~loadRelaysOptions](#module_useRelays..loadRelaysOptions) : <code>Object</code>
-        * [~Relays](#module_useRelays..Relays) : <code>Array.&lt;Object&gt;</code>
-
-### loadRelays(loadRelaysOptions) ⇒ <code>relays</code>
-  Load the list of the relays
-
-
-| Param | Type |
-| --- | --- |
-| loadRelaysOptions | <code>Object</code> | 
-
-### useRelays() ⇒ <code>useRelays</code>
-  Gets the list of actual gun relays and tool to update the list
-
-**Example**  
-```js
-import { useRelays } from '@gun-vue/composables'
-const { relays, errors, loadRelays } = useRelays()
-```
-### useRelays : <code>Object</code>
-  **Properties**
-
-| Name | Type |
-| --- | --- |
-| Relays | <code>Object</code> | 
-| Errors | <code>Object</code> | 
-| loadRelays | <code>function</code> | 
-
-### loadRelaysOptions : <code>Object</code>
-  **Properties**
-
-| Name | Type |
-| --- | --- |
-| source | <code>String</code> | 
-
-### Relays : <code>Array.&lt;Object&gt;</code>
-  **Properties**
-
-| Name | Type |
-| --- | --- |
-| hostname | <code>String</code> | 
-| url | <code>String</code> | 
-| ping | <code>Number</code> | 
-
 <hr />
 
   <a name="module_useWorker"></a>

Diff for: components/tsconfig.json

@@ -14,7 +14,6 @@
 		"isolatedModules": true,
 		"noEmit": true,
 		"baseUrl": "./",
-		"jsx": "preserve",
 		"paths": {
 			"@/*": ["./*"],
 			"#composables": ["../composables/src/"],

Diff for: composables/src/account/Account.d.ts

@@ -7,8 +7,8 @@ interface Profile {
   name?: string
   first_name?: string
   last_name?: string
-	birth_day?: string
-	[key:string]:string | undefined
+  birth_day?: string
+  [key: string]: string | undefined
 }
 
 interface Account {
@@ -17,15 +17,17 @@ interface Account {
   pulse: number
   blink: boolean
   profile: Profile
-	petname?: string
-	[key:string]: any
+  petname?: string
+  db?: object
+  [key: string]: string | ComputedRef | number | Profile | boolean | Ref | object
 }
 
 import { useGun, useUser, SEA } from "../index.js";
 import { useColor } from "../ui/index.js";
 import { computed, ComputedRef, reactive, Ref, ref } from "vue";
 import ms from "ms";
 
+
 const colorDeep = useColor("deep");
 
 /**
@@ -67,15 +69,15 @@ export function useAccount(pub = ref(), { TIMEOUT = 10000 } = {}) {
   const { user } = useUser()
   const account = computed(() => {
 
-    const acc:Account = reactive({
-      pub:pub.value,
+    const acc: Account = reactive({
+      pub: pub.value,
       color: computed(() => (pub.value ? colorDeep.hex(pub.value) : "gray")),
       profile: {
         name: "",
       },
       pulse: 0,
       lastSeen: computed(() => {
-        let time = Date.now() - acc.pulse;
+        const time = Date.now() - acc.pulse;
         if (time > TIMEOUT) {
           return ms(time);
         } else {
@@ -87,7 +89,7 @@ export function useAccount(pub = ref(), { TIMEOUT = 10000 } = {}) {
     });
 
     if (user.is) {
-      gun.user().get('petnames').get(pub.value).on(async(d:string) => {
+      gun.user().get('petnames').get(pub.value).on(async (d: string) => {
         acc.petname = await SEA.decrypt(d, user.pair())
       })
     }
@@ -104,7 +106,7 @@ export function useAccount(pub = ref(), { TIMEOUT = 10000 } = {}) {
       .back()
       .get("profile")
       .map()
-      .on((data:string, key:string) => {
+      .on((data: string, key: string) => {
         acc.profile[key] = data;
       });
     return acc;
@@ -114,7 +116,7 @@ export function useAccount(pub = ref(), { TIMEOUT = 10000 } = {}) {
 }
 
 
-export async function setPetname(pub:string, name:string) {
+export async function setPetname(pub: string, name: string) {
   const { user } = useUser()
   if (!user.is) return
   const gun = useGun();

Diff for: composables/src/account/index.js renamed to composables/src/account/index.ts

@@ -2,7 +2,7 @@
  * Gun DB initialization and basic methods
  * @module useGun
  */
-import type {IGun, IGunInstance} from 'gun'
+import type { IGunInstance } from 'gun'
 
 import Gun from "gun/gun";
 import "gun/lib/then";
@@ -53,7 +53,7 @@ export function useGun(options: object = { localStorage: false }): IGunInstance
  * get a secondary Gun instance for certificate management
  */
 
-export function useGun2(options: object = { localStorage: false }):IGunInstance {
+export function useGun2(options: object = { localStorage: false }): IGunInstance {
   if (!gun2) {
     gun2 = Gun({ peers: [peer.value], ...options });
     gunInstances.push(gun2)
@@ -73,7 +73,7 @@ export { default as SEA } from "gun/sea.js";
  * @function soul
  */
 
-// @ts-ignore
+// @ts-ignore: Incorrect GUN types
 export const soul = Gun?.node?.soul;
 
 /**
@@ -82,7 +82,7 @@ export const soul = Gun?.node?.soul;
  * @function genUUID
  */
 
-// @ts-ignore
-export const genUUID:Function = Gun?.text?.random;
+// @ts-ignore: Incorrect Gun types
+export const genUUID: (num: number) => string = Gun?.text?.random;
 
 

Diff for: composables/src/account/useAccount.ts

@@ -5,12 +5,13 @@
 
 import { useGun } from '.'
 import { computed, reactive, watch } from 'vue'
+import type { Ref } from 'vue'
 import { useStorage } from "@vueuse/core";
 import ms from 'ms'
-import { defaultPeer } from '..';
 
+const defaultPeer = "https://gun.defucc.me/gun";
 
-export const peer = useStorage("peer", defaultPeer);
+export const peer: Ref = useStorage("peer", defaultPeer);
 
 /**
  * @typedef {reactive} Relay Peer server status reactive object
@@ -37,7 +38,19 @@ export const peer = useStorage("peer", defaultPeer);
  * }
  */
 
-export const relay = reactive({
+interface Relay {
+  peer: string
+  host: string
+  status: string
+  pulse: number
+  lag: number
+  started: number
+  diff: number
+  age: string
+  blink: boolean
+}
+
+export const relay: Relay = reactive({
   list: [],
   peer: peer.value,
   host: new URL(peer.value).hostname,
@@ -59,7 +72,7 @@ watch(
   },
 )
 
-function setPeer(url) {
+function setPeer(url: string) {
   peer.value = url
   window.location.reload()
 }
@@ -79,13 +92,15 @@ function resetPeer() {
  *
  * const { relay, setPeer, resetPeer } = useRelay()
  */
-export function useRelay() {
+export function useRelay(): { relay: Relay, setPeer: (url: string) => void, resetPeer: () => void } {
   const gun = useGun()
   if (relay.pulse == 0) {
     gun
       .get(relay.host)
       .map()
-      .on((d, k) => {
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      //@ts-ignore
+      .on((d: string, k: string) => {
         relay[k] = d
       })
   }