hyperware-ai · dr-frmr · Aug 13, 2024 · Aug 13, 2024 · Aug 13, 2024 · Aug 13, 2024
diff --git a/css/kinode.css b/css/kinode.css
@@ -20,7 +20,7 @@ input,
 button,
 textarea,
 select {
-    font: inherit;
+    font-family: var(--font-family-main);
 }
 
 /* Variables */
@@ -38,6 +38,8 @@ select {
     --maroon: #4f0000;
     --gray: #657b83;
     --tasteful-dark: #1f1f1f;
+
+    --font-family-main: 'Kode Mono', monospace;
 }
 
 /* Typography */
@@ -49,10 +51,16 @@ h5,
 h6,
 p,
 label,
-li {
+li,
+span {
+    font-family: var(--font-family-main);
     color: light-dark(var(--off-black), var(--off-white));
 }
 
+p {
+    font-size: 0.8em;
+}
+
 h1 {
     font-size: 2em;
 }
@@ -78,6 +86,7 @@ h6 {
 }
 
 a {
+    font-family: var(--font-family-main);
     color: light-dark(var(--blue), var(--orange));
     text-decoration: none;
 }
@@ -89,7 +98,6 @@ a:hover {
 
 /* Layout */
 body {
-    font-family: var(--font-family-main, sans-serif);
     line-height: 1.6;
     -webkit-font-smoothing: antialiased;
     background-color: light-dark(var(--tan), var(--tasteful-dark));
@@ -162,7 +170,7 @@ button:disabled {
 }
 
 button.secondary {
-    background-color: white;
+    background-color: light-dark(var(--off-white), var(--off-black));
     color: var(--orange);
     border: 2px solid var(--orange);
 }

diff --git a/kinode/packages/app_store/ui/src/abis/helpers.ts b/kinode/packages/app_store/ui/src/abis/helpers.ts
@@ -1,9 +1,9 @@
-import { multicallAbi, kinomapAbi, mechAbi, KINOMAP, MULTICALL, KINO_ACCOUNT_IMPL } from "./";
+import { multicallAbi, kimapAbi, mechAbi, KIMAP, MULTICALL, KINO_ACCOUNT_IMPL } from "./";
 import { encodeFunctionData, encodePacked, stringToHex } from "viem";
 
 export function encodeMulticalls(metadataUri: string, metadataHash: string) {
     const metadataHashCall = encodeFunctionData({
-        abi: kinomapAbi,
+        abi: kimapAbi,
         functionName: 'note',
         args: [
             encodePacked(["bytes"], [stringToHex("~metadata-hash")]),
@@ -12,7 +12,7 @@ export function encodeMulticalls(metadataUri: string, metadataHash: string) {
     })
 
     const metadataUriCall = encodeFunctionData({
-        abi: kinomapAbi,
+        abi: kimapAbi,
         functionName: 'note',
         args: [
             encodePacked(["bytes"], [stringToHex("~metadata-uri")]),
@@ -21,8 +21,8 @@ export function encodeMulticalls(metadataUri: string, metadataHash: string) {
     })
 
     const calls = [
-        { target: KINOMAP, callData: metadataHashCall },
-        { target: KINOMAP, callData: metadataUriCall },
+        { target: KIMAP, callData: metadataHashCall },
+        { target: KIMAP, callData: metadataUriCall },
     ];
 
     const multicall = encodeFunctionData({
@@ -46,7 +46,7 @@ export function encodeIntoMintCall(multicalls: `0x${string}`, our_address: `0x${
     });
 
     const mintCall = encodeFunctionData({
-        abi: kinomapAbi,
+        abi: kimapAbi,
         functionName: 'mint',
         args: [
             our_address,

diff --git a/kinode/packages/app_store/ui/src/abis/index.ts b/kinode/packages/app_store/ui/src/abis/index.ts
@@ -2,7 +2,7 @@ import { parseAbi } from "viem";
 
 export { encodeMulticalls, encodeIntoMintCall } from "./helpers";
 
-export const KINOMAP: `0x${string}` = "0xAfA2e57D3cBA08169b416457C14eBA2D6021c4b5";
+export const KIMAP: `0x${string}` = "0xAfA2e57D3cBA08169b416457C14eBA2D6021c4b5";
 export const MULTICALL: `0x${string}` = "0xcA11bde05977b3631167028862bE2a173976CA11";
 export const KINO_ACCOUNT_IMPL: `0x${string}` = "0xd30217e86A4910f4D7cB3E73fC3CfD28a2C33e4e";
 
@@ -12,7 +12,7 @@ export const multicallAbi = parseAbi([
     `struct Call { address target; bytes callData; }`,
 ]);
 
-export const kinomapAbi = parseAbi([
+export const kimapAbi = parseAbi([
     "function mint(address, bytes calldata, bytes calldata, bytes calldata, address) external returns (address tba)",
     "function note(bytes calldata,bytes calldata) external returns (bytes32)",
     "function get(bytes32 node) external view returns (address tokenBoundAccount, address tokenOwner, bytes memory note)",

diff --git a/kinode/packages/app_store/ui/src/pages/PublishPage.tsx b/kinode/packages/app_store/ui/src/pages/PublishPage.tsx
@@ -3,7 +3,7 @@ import { useLocation } from "react-router-dom";
 import { useAccount, useWriteContract, useWaitForTransactionReceipt, usePublicClient } from 'wagmi'
 import { ConnectButton, useConnectModal } from '@rainbow-me/rainbowkit';
 import { keccak256, toBytes } from 'viem';
-import { mechAbi, KINOMAP, encodeIntoMintCall, encodeMulticalls, kinomapAbi, MULTICALL } from "../abis";
+import { mechAbi, KIMAP, encodeIntoMintCall, encodeMulticalls, kimapAbi, MULTICALL } from "../abis";
 import { kinohash } from '../utils/kinohash';
 import useAppsStore from "../store";
 import { AppInfo } from "../types/Apps";
@@ -71,8 +71,8 @@ export default function PublishPage() {
       try {
         // Check if the package already exists and get its TBA
         let data = await publicClient.readContract({
-          abi: kinomapAbi,
-          address: KINOMAP,
+          abi: kimapAbi,
+          address: KIMAP,
           functionName: 'get',
           args: [kinohash(`${packageName}.${publisherId}`)]
         });
@@ -84,8 +84,8 @@ export default function PublishPage() {
         // If the package doesn't exist, check for the publisher's TBA
         if (!currentTBA) {
           data = await publicClient.readContract({
-            abi: kinomapAbi,
-            address: KINOMAP,
+            abi: kimapAbi,
+            address: KIMAP,
             functionName: 'get',
             args: [kinohash(publisherId)]
           });
@@ -108,10 +108,10 @@ export default function PublishPage() {
 
         writeContract({
           abi: mechAbi,
-          address: currentTBA || KINOMAP,
+          address: currentTBA || KIMAP,
           functionName: 'execute',
           args: [
-            isUpdate ? MULTICALL : KINOMAP,
+            isUpdate ? MULTICALL : KIMAP,
             BigInt(0),
             args,
             isUpdate ? 1 : 0
@@ -141,8 +141,8 @@ export default function PublishPage() {
         }
 
         const data = await publicClient.readContract({
-          abi: kinomapAbi,
-          address: KINOMAP,
+          abi: kimapAbi,
+          address: KIMAP,
           functionName: 'get',
           args: [kinohash(`${packageName}.${publisherName}`)]
         });
@@ -161,7 +161,7 @@ export default function PublishPage() {
           address: tba as `0x${string}`,
           functionName: 'execute',
           args: [
-            KINOMAP,
+            KIMAP,
             BigInt(0),
             multicall,
             1

diff --git a/kinode/src/http/login.html b/kinode/src/http/login.html
@@ -143,7 +143,7 @@ <h3 id="node-and-domain" class="flex flex-col text-lg"></h3>
           oninput="document.getElementById('password-err').style.display = 'none';" value="" class="self-stretch mb-2">
         <div id="password-err" class="login-row flex mb-2" style="display: none;"> Incorrect Password </div>
         <div class="flex flex-col leading-6 self-stretch mb-2">
-          <button> Login </button>
+          <button id="login-button" disabled> Login </button>
           <div class="flex flex-col mt-2 text-sm leading-6" id="fake-or-not"></div>
         </div>
       </form>
@@ -156,20 +156,27 @@ <h3>Logging in...</h3>
 
   <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.2.0/crypto-js.min.js"></script>
   <script>
-    if ('${fake}' === 'true') {
-      document.getElementById("fake-or-not").innerHTML = "Fake node -- any password will work!";
-    } else {
-      document.getElementById("fake-or-not").innerHTML = "Restart your node to change networking settings.";
-    }
+    let isInitialized = false;
+
+    function initializeLoginForm() {
+      if ('${fake}' === 'true') {
+        document.getElementById("fake-or-not").innerHTML = "Fake node -- any password will work!";
+      } else {
+        document.getElementById("fake-or-not").innerHTML = "Restart your node to change networking settings.";
+      }
+
+      const firstPathItem = window.location.pathname.split('/')[1];
+      const expectedSecureSubdomain = generateSecureSubdomain(firstPathItem);
+      const maybeSecureSubdomain = window.location.host.split('.')[0];
+      const isSecureSubdomain = expectedSecureSubdomain === maybeSecureSubdomain;
+      if (isSecureSubdomain) {
+        document.getElementById("node-and-domain").innerText = "${node}: authenticate for secure subdomain app " + firstPathItem;
+      } else {
+        document.getElementById("node-and-domain").innerText = "${node} ";
+      }
 
-    const firstPathItem = window.location.pathname.split('/')[1];
-    const expectedSecureSubdomain = generateSecureSubdomain(firstPathItem);
-    const maybeSecureSubdomain = window.location.host.split('.')[0];
-    const isSecureSubdomain = expectedSecureSubdomain === maybeSecureSubdomain;
-    if (isSecureSubdomain) {
-      document.getElementById("node-and-domain").innerText = "${node}: authenticate for secure subdomain app " + firstPathItem;
-    } else {
-      document.getElementById("node-and-domain").innerText = "${node} ";
+      document.getElementById("login-button").disabled = false;
+      isInitialized = true;
     }
 
     async function login(password) {
@@ -197,7 +204,6 @@ <h3>Logging in...</h3>
         document.getElementById("password").value = "";
         document.getElementById("password-err").style.display = "flex";
         document.getElementById("password").focus();
-        return;
       }
     }
 
@@ -213,12 +219,15 @@ <h3>Logging in...</h3>
     }
 
     document.addEventListener("DOMContentLoaded", () => {
+      initializeLoginForm();
       const form = document.getElementById("login-form");
       form.addEventListener("submit", (e) => {
         e.preventDefault();
         e.stopPropagation();
-        const password = document.getElementById("password").value;
-        login(password);
+        if (isInitialized) {
+          const password = document.getElementById("password").value;
+          login(password);
+        }
       });
     });
   </script>

diff --git a/kinode/src/register-ui/index.html b/kinode/src/register-ui/index.html
@@ -11,6 +11,7 @@
   <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport"
     content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
+  <link href="https://fonts.googleapis.com/css2?family=Kode+Mono:wght@700&display=swap" rel="stylesheet">
 </head>
 
 <body>

diff --git a/kinode/src/register-ui/src/abis/helpers.ts b/kinode/src/register-ui/src/abis/helpers.ts
@@ -2,7 +2,7 @@
 import { NetworkingInfo } from "../lib/types";
 import { kinohash } from "../utils/kinohash";
 import { ipToBytes, portToBytes } from "../utils/kns_encoding";
-import { multicallAbi, kinomapAbi, mechAbi, KINOMAP, MULTICALL } from "./";
+import { multicallAbi, kimapAbi, mechAbi, KIMAP, MULTICALL } from "./";
 import { encodeFunctionData, encodePacked, stringToHex, bytesToHex } from "viem";
 
 // Function to encode router names into keccak256 hashes
@@ -58,7 +58,7 @@ export const generateNetworkingKeys = async ({
     console.log("networking_key: ", networking_key);
 
     const netkeycall = encodeFunctionData({
-        abi: kinomapAbi,
+        abi: kimapAbi,
         functionName: 'note',
         args: [
             encodePacked(["bytes"], [stringToHex("~net-key")]),
@@ -68,7 +68,7 @@ export const generateNetworkingKeys = async ({
 
     const ws_port_call =
         encodeFunctionData({
-            abi: kinomapAbi,
+            abi: kimapAbi,
             functionName: 'note',
             args: [
                 encodePacked(["bytes"], [stringToHex("~ws-port")]),
@@ -78,7 +78,7 @@ export const generateNetworkingKeys = async ({
 
     const tcp_port_call =
         encodeFunctionData({
-            abi: kinomapAbi,
+            abi: kimapAbi,
             functionName: 'note',
             args: [
                 encodePacked(["bytes"], [stringToHex("~tcp-port")]),
@@ -88,7 +88,7 @@ export const generateNetworkingKeys = async ({
 
     const ip_address_call =
         encodeFunctionData({
-            abi: kinomapAbi,
+            abi: kimapAbi,
             functionName: 'note',
             args: [
                 encodePacked(["bytes"], [stringToHex("~ip")]),
@@ -100,7 +100,7 @@ export const generateNetworkingKeys = async ({
 
     const router_call =
         encodeFunctionData({
-            abi: kinomapAbi,
+            abi: kimapAbi,
             functionName: 'note',
             args: [
                 encodePacked(["bytes"], [stringToHex("~routers")]),
@@ -111,13 +111,13 @@ export const generateNetworkingKeys = async ({
         });
 
     const calls = direct ? [
-        { target: KINOMAP, callData: netkeycall },
-        { target: KINOMAP, callData: ws_port_call },
-        { target: KINOMAP, callData: tcp_port_call },
-        { target: KINOMAP, callData: ip_address_call },
+        { target: KIMAP, callData: netkeycall },
+        { target: KIMAP, callData: ws_port_call },
+        { target: KIMAP, callData: tcp_port_call },
+        { target: KIMAP, callData: ip_address_call },
     ] : [
-        { target: KINOMAP, callData: netkeycall },
-        { target: KINOMAP, callData: router_call },
+        { target: KIMAP, callData: netkeycall },
+        { target: KIMAP, callData: router_call },
     ];
 
     const multicalls = encodeFunctionData({
@@ -143,7 +143,7 @@ export const generateNetworkingKeys = async ({
 
     // to mint a subname of your own, you would do something like this.
     // const mintCall = encodeFunctionData({
-    //     abi: kinomapAbi,
+    //     abi: kimapAbi,
     //     functionName: 'mint',
     //     args: [
     //         our_address,

diff --git a/kinode/src/register-ui/src/abis/index.ts b/kinode/src/register-ui/src/abis/index.ts
@@ -3,7 +3,7 @@ import { parseAbi } from "viem";
 export { generateNetworkingKeys } from "./helpers";
 
 // move to constants? // also for anvil/optimism
-export const KINOMAP: `0x${string}` = "0xcA92476B2483aBD5D82AEBF0b56701Bb2e9be658";
+export const KIMAP: `0x${string}` = "0xcA92476B2483aBD5D82AEBF0b56701Bb2e9be658";
 export const MULTICALL: `0x${string}` = "0xcA11bde05977b3631167028862bE2a173976CA11";
 export const KINO_ACCOUNT_IMPL: `0x${string}` = "0x38766C70a4FB2f23137D9251a1aA12b1143fC716";
 export const DOTOS: `0x${string}` = "0x9BD054E4c7753791FA0C138b9713319F62ed235D";
@@ -13,7 +13,7 @@ export const multicallAbi = parseAbi([
     `struct Call { address target; bytes callData; }`,
 ]);
 
-export const kinomapAbi = parseAbi([
+export const kimapAbi = parseAbi([
     "function mint(address, bytes calldata, bytes calldata, bytes calldata, address) external returns (address tba)",
     "function note(bytes calldata,bytes calldata) external returns (bytes32)",
     "function get(bytes32 node) external view returns (address tokenBoundAccount, address tokenOwner, bytes memory note)",

diff --git a/kinode/src/register-ui/src/components/DirectTooltip.tsx b/kinode/src/register-ui/src/components/DirectTooltip.tsx
@@ -1,3 +1,5 @@
 import { Tooltip } from "./Tooltip";
 
-export const DirectTooltip: React.FC = () => <Tooltip text={`A direct node publishes its own networking information on-chain: IP, port, so on. An indirect node relies on the service of routers, which are themselves direct nodes. Only register a direct node if you know what you’re doing and have a public, static IP address.`} />
+export const DirectTooltip: React.FC = () => <Tooltip text={`A direct node publishes its own networking information on-chain: IP, port, so on. An indirect node relies on the service of routers, which are themselves direct nodes. Only register a direct node if you know what you're doing and have a public, static IP address.`}>
+    <span>ⓘ</span>
+</Tooltip>