Merge pull request #90 from holochain/feat/load-webhapp-default-data

Feat/load webhapp default data

.husky/pre-commit

@@ -1,2 +1 @@
-yarn lintAndFormatAllPrePush
-
+yarn lint-staged

README.md

@@ -16,6 +16,12 @@ Build the sidecar binaries (requires Rust and Go installed):
 bash ./scripts/setup-binaries.sh
 ```
 
+or fetch with
+
+```bash
+yarn fetch:binaries
+```
+
 Build the Node Rust-add-ons
 
 ```bash

package.json

@@ -70,6 +70,9 @@
     "winston": "3.13.0",
     "zod": "^3.23.6"
   },
+  "lint-staged": {
+    "*.{js,ts,svelte,json,postcss,html}": "yarn lintAndFormatAllPrePush"
+  },
   "devDependencies": {
     "@electron-toolkit/eslint-config-prettier": "^2.0.0",
     "@electron-toolkit/eslint-config-ts": "^2.0.0",
@@ -91,6 +94,7 @@
     "get-port": "7.1.0",
     "husky": "^9.0.11",
     "js-yaml": "^4.1.0",
+    "lint-staged": "^15.2.4",
     "mocha": "10.4.0",
     "prettier": "^3.1.1",
     "rimraf": "5.0.5",

src/main/index.ts

@@ -4,7 +4,7 @@ import { AppWebsocket, type CallZomeRequest } from '@holochain/client';
 import { decode } from '@msgpack/msgpack';
 import { initTRPC } from '@trpc/server';
 import type { AppVersionEntry } from 'appstore-tools';
-import { AppstoreAppClient, DevhubAppClient } from 'appstore-tools';
+import { AppstoreAppClient } from 'appstore-tools';
 import { webhappToHappAndUi } from 'appstore-tools';
 import * as childProcess from 'child_process';
 import { Command, Option } from 'commander';
@@ -206,7 +206,7 @@ const WINDOW_INFO_MAP: WindowInfoRecord = {}; // WindowInfo by webContents.id -
 
 const APP_CLIENTS: Record<InstalledAppId, AppClient> = {};
 let APPSTORE_APP_CLIENT: AppstoreAppClient | undefined;
-let DEVHUB_APP_CLIENT: DevhubAppClient | undefined;
+// let DEVHUB_APP_CLIENT: DevhubAppClient | undefined;
 
 const handleSignZomeCall = async (e: IpcMainInvokeEvent, request: CallZomeRequest) => {
   // TODO check here that cellId belongs to the installedAppId that the window belongs to
@@ -466,15 +466,14 @@ const getAppstoreAppClient = async () => {
   return APPSTORE_APP_CLIENT;
 };
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const getDevhubAppClient = async () => {
-  if (DEVHUB_APP_CLIENT) return DEVHUB_APP_CLIENT;
-  if (!DEFAULT_HOLOCHAIN_DATA_ROOT) throw new Error('Default holochain data root is not defined.');
-  const appClient = await getAppClient(DEVHUB_APP_ID);
-  const devhubAppClient = new DevhubAppClient(appClient);
-  DEVHUB_APP_CLIENT = devhubAppClient;
-  return DEVHUB_APP_CLIENT;
-};
+// const getDevhubAppClient = async () => {
+//   if (DEVHUB_APP_CLIENT) return DEVHUB_APP_CLIENT;
+//   if (!DEFAULT_HOLOCHAIN_DATA_ROOT) throw new Error('Default holochain data root is not defined.');
+//   const appClient = await getAppClient(DEVHUB_APP_ID);
+//   const devhubAppClient = new DevhubAppClient(appClient);
+//   DEVHUB_APP_CLIENT = devhubAppClient;
+//   return DEVHUB_APP_CLIENT;
+// };
 
 const router = t.router({
   openSettings: t.procedure.mutation(() => {
@@ -664,18 +663,23 @@ const router = t.router({
   launch: handlePasswordInput(handleLaunch),
   initializeDefaultAppPorts: t.procedure.query(async () => {
     const defaultHolochainManager = HOLOCHAIN_MANAGERS[DEFAULT_HOLOCHAIN_DATA_ROOT!.name];
-    const appstoreAuthenticationToken = await defaultHolochainManager.getAppToken(APP_STORE_APP_ID);
-    const devhubAuthenticationToken = await defaultHolochainManager.getAppToken(DEVHUB_APP_ID);
-    if (!appstoreAuthenticationToken) {
-      return throwTRPCErrorError({
-        message: NO_APPSTORE_AUTHENTICATION_TOKEN_FOUND,
-      });
-    }
-    if (isDevhubInstalled(HOLOCHAIN_MANAGERS) && !devhubAuthenticationToken) {
-      return throwTRPCErrorError({
-        message: NO_DEVHUB_AUTHENTICATION_TOKEN_FOUND,
-      });
-    }
+
+    const getTokenOrThrow = async (appId: string, errorMessage: string) => {
+      const token = await defaultHolochainManager.getAppToken(appId);
+      if (!token) {
+        throwTRPCErrorError({ message: errorMessage });
+      }
+      return token;
+    };
+
+    const appstoreAuthenticationToken = await getTokenOrThrow(
+      APP_STORE_APP_ID,
+      NO_APPSTORE_AUTHENTICATION_TOKEN_FOUND,
+    );
+    const devhubAuthenticationToken = isDevhubInstalled(HOLOCHAIN_MANAGERS)
+      ? await getTokenOrThrow(DEVHUB_APP_ID, NO_DEVHUB_AUTHENTICATION_TOKEN_FOUND)
+      : undefined;
+
     return validateWithZod({
       schema: InitializeAppPortsSchema,
       data: {

src/renderer/src/app.postcss

@@ -56,6 +56,10 @@ body {
 	@apply bg-button-gradient font-semibold;
 }
 
+.btn-happ-button {
+	@apply btn bg-add-happ-button font-semibold;
+}
+
 .btn-secondary,
 .btn-install {
 	@apply border border-surface-400 bg-transparent !text-sm;

src/renderer/src/lib/const/launcher.ts

@@ -2,13 +2,14 @@ import { SETTINGS_SCREEN } from '$shared/const';
 
 export const MODAL_INSTALL_FROM_FILE = 'modalInstallFromFile';
 export const MODAL_INSTALL_KANDO = 'modalInstallKando';
-export const MODAL_ADD_PUBLISHER = 'modalAddPublisher';
 export const MODAL_ADD_NEW_HAPP_VERSION = 'modalAddNewHappVersion';
 export const MODAL_DEVHUB_INSTALLATION_CONFIRMATION = 'modalDevHubInstallationConfirmation';
 
 export const SELECTED_ICON_STYLE = 'fill-light-primary dark:fill-white';
 
 export const DEV_PAGE = `${SETTINGS_SCREEN}/dev`;
+export const DEV_APP_PAGE = `${DEV_PAGE}/app`;
+export const PUBLISHER_SCREEN = `${DEV_PAGE}/publisher`;
 
 export const SEARCH_URL_QUERY = 'search';
 export const PRESEARCH_URL_QUERY = 'presearch';

src/renderer/src/lib/helpers/display.ts

@@ -19,7 +19,11 @@ export const showModalError = ({
 	modalStore.trigger(modal);
 };
 
-export const createModalParams = (component: Modals): ModalSettings => ({
+export const createModalParams = (
+	component: Modals,
+	response?: (r: unknown) => void
+): ModalSettings => ({
 	type: 'component' as const,
-	component
+	component,
+	response
 });

src/renderer/src/lib/icons/Publisher.svelte

@@ -0,0 +1,10 @@
+<svg width="78" height="78" viewBox="0 0 78 78" fill="none" xmlns="http://www.w3.org/2000/svg">
+	<path
+		d="M62.3336 42.3357H58.5432C58.4845 34.8362 54.1803 28.3468 47.9189 25.122C51.1089 22.524 53.1511 18.5778 53.1511 14.1517C53.1511 6.34558 46.8027 0 38.9993 0C31.1962 0 24.8478 6.35325 24.8478 14.1594C24.8478 18.5854 26.89 22.5228 30.0798 25.1207C23.8183 28.3455 19.514 34.8362 19.4553 42.3357H15.6649C12.7317 42.3357 10.3502 45.0635 10.705 47.97L13.8325 73.6025C14.138 76.1063 16.2703 77.9998 18.7925 77.9998H59.2062C61.7283 77.9998 63.8607 76.1115 64.1662 73.6076L65.0561 66.3159L59.7625 65.6698L58.9085 72.6669H19.0902L16.0447 47.6685H61.9541L61.0462 55.1305L66.3399 55.787L67.2938 47.9648C67.6471 45.0677 65.2721 42.3357 62.3336 42.3357ZM30.1808 14.1619C30.1808 9.29655 34.1367 5.33815 38.9993 5.33815C43.862 5.33815 47.8181 9.29655 47.8181 14.1619C47.8181 19.0272 43.862 22.9856 38.9993 22.9856C34.1367 22.9856 30.1808 19.0274 30.1808 14.1619ZM36.3328 28.5731V38.336H41.6658V28.5731C48.1829 29.8157 53.1344 35.5028 53.2084 42.3357H24.7903C24.8643 35.5028 29.8156 29.8157 36.3328 28.5731Z"
+		fill="white"
+	/>
+	<path
+		d="M60.1468 62.5466L60.68 58.1814L65.9735 58.8281L65.4403 63.1931L60.1468 62.5466ZM33.1666 54.5258L22.834 59.8295V62.2858L33.1666 67.5895V63.5601L28.1773 61.0577L33.1666 58.5554V54.5258ZM38.4456 67.5007L44.1026 52.835H40.2352L34.5979 67.5007H38.4456ZM44.8325 67.5853L55.1652 62.304V59.8115L44.8325 54.53V58.5584L49.8549 61.0577L44.8325 63.5571V67.5853Z"
+		fill="white"
+	/>
+</svg>

src/renderer/src/lib/icons/index.ts

@@ -11,6 +11,7 @@ export { default as MenuGear } from './Menu-Gear.svelte';
 export { default as MenuInfo } from './Menu-Info.svelte';
 export { default as PasswordEye } from './PasswordEye.svelte';
 export { default as Plus } from './Plus.svelte';
+export { default as Publisher } from './Publisher.svelte';
 export { default as Rocket } from './Rocket.svelte';
 export { default as Upload } from './Upload.svelte';
 export { default as UploadImage } from './UploadImage.svelte';

src/renderer/src/lib/locale/en/common.json

@@ -48,9 +48,12 @@
 	"passwordPlaceholder": "Enter your password",
 	"passwordWarning": "Your password can not be reset, recovered or changed. Save it in your password manager or some other secure location.",
 	"passwordsDontMatch": "Passwords don't match!",
+	"publishYourApp": "Publish your App",
+	"publishingDashboard": "Publishing Dashboard",
 	"region": "Region",
 	"releases": "Releases",
 	"searchForApps": "Search for apps",
+	"setUpYourPublisherProfile": "Set up your publisher profile",
 	"setYourPassword": "Set your password",
 	"setupError": "Setup Error",
 	"setupProgress": "Setup Progress",
@@ -62,9 +65,11 @@
 	"uninstall": "Uninstall",
 	"updateAvailable": "Update available",
 	"uploadAndPublish": "upload and publish apps",
+	"uploadYourBundle": "Upload your bundle",
 	"useWebhappFileToAddHapp": "Use a webhapp file to add your hApp",
 	"versionHistory": "Version History",
 	"website": "Website",
+	"welcomeToTheHolochainLauncherDeveloperDashboard": "Welcome to the Holochain Launcher Developer Dashboard! Sharing your app with the world begins with creating a publisher account.",
 	"whatDoYouWantToInstall": "What do you want to install?",
 	"yourHapps": "Your hApps"
 }

src/renderer/src/lib/modal/AddNewHappVersion.svelte

@@ -25,7 +25,9 @@
 		.sort((a, b) => a.last_updated - b.last_updated)[0].bundle_hashes.happ_hash;
 
 	const setAppDataBytes = async (files: FileList | null) => {
-		bytes = files && files.length > 0 ? await convertFileToUint8Array(files[0]) : undefined;
+		if (files && files.length > 0) {
+			bytes = await convertFileToUint8Array(files[0]);
+		}
 	};
 
 	$: setAppDataBytes(files);
@@ -57,7 +59,7 @@
 				}
 			}}
 		>
-			<InputWithLabel bind:files id="webbhapp" label={`${$i18n.t('webbhapp')}*`} />
+			<InputWithLabel bind:files id="webbhapp" label={`${$i18n.t('uploadYourBundle')}*`} />
 			<InputWithLabel
 				bind:value={version}
 				id="version"

src/renderer/src/lib/modal/DevHubInstallationConfirmation.svelte

@@ -2,16 +2,10 @@
 	import { getModalStore } from '@skeletonlabs/skeleton';
 
 	import { Button } from '$components';
-	import { showModalError } from '$helpers';
 	import { Confirmation } from '$icons';
-	import { createDevHubClient, i18n, trpc } from '$services';
-
-	const client = trpc();
+	import { i18n } from '$services';
 
 	const modalStore = getModalStore();
-
-	const installDevhub = client.installDevhub.createMutation();
-	const isDevhubInstalled = client.isDevhubInstalled.createQuery();
 </script>
 
 {#if $modalStore[0]}
@@ -34,25 +28,9 @@
 			<Button
 				props={{
 					onClick: () => {
-						$installDevhub.mutate(undefined, {
-							onSuccess: async ({ appPort, authenticationToken }) => {
-								if (!appPort) {
-									modalStore.close();
-									showModalError({
-										modalStore,
-										errorTitle: $i18n.t('appError'),
-										errorMessage: $i18n.t('noAppPortError')
-									});
-									return;
-								}
-
-								await createDevHubClient(appPort, authenticationToken);
-								$isDevhubInstalled.refetch();
-								modalStore.close();
-							}
-						});
+						$modalStore[0]?.response?.(true);
+						modalStore.close();
 					},
-					isLoading: $installDevhub.isPending,
 					type: 'submit',
 					class: 'btn-secondary bg-add-happ-button flex-1'
 				}}

src/renderer/src/lib/modal/index.ts

@@ -1,5 +1,4 @@
 export { default as AddNewHappVersion } from './AddNewHappVersion.svelte';
-export { default as AddPublisher } from './AddPublisher.svelte';
 export { default as DevHubInstallationConfirmation } from './DevHubInstallationConfirmation.svelte';
 export { default as InstallAppFromHashes } from './InstallAppFromHashes.svelte';
 export { default as InstallFromFile } from './InstallFromFile.svelte';

src/renderer/src/lib/types/components.ts

@@ -1,6 +1,5 @@
 import {
 	MODAL_ADD_NEW_HAPP_VERSION,
-	MODAL_ADD_PUBLISHER,
 	MODAL_DEVHUB_INSTALLATION_CONFIRMATION,
 	MODAL_INSTALL_FROM_FILE,
 	MODAL_INSTALL_KANDO
@@ -25,7 +24,6 @@ type TextProps = {
 export type Modals =
 	| typeof MODAL_INSTALL_FROM_FILE
 	| typeof MODAL_INSTALL_KANDO
-	| typeof MODAL_ADD_PUBLISHER
 	| typeof MODAL_ADD_NEW_HAPP_VERSION
 	| typeof MODAL_DEVHUB_INSTALLATION_CONFIRMATION;
 

src/renderer/src/routes/+layout.svelte

@@ -5,24 +5,17 @@
 	import { QueryClient, QueryClientProvider } from '@tanstack/svelte-query';
 
 	import {
-		MODAL_ADD_PUBLISHER,
 		MODAL_DEVHUB_INSTALLATION_CONFIRMATION,
 		MODAL_INSTALL_FROM_FILE,
 		MODAL_INSTALL_KANDO
 	} from '$const';
-	import {
-		AddPublisher,
-		DevHubInstallationConfirmation,
-		InstallFromFile,
-		InstallKando
-	} from '$modal';
+	import { DevHubInstallationConfirmation, InstallFromFile, InstallKando } from '$modal';
 
 	const queryClient = new QueryClient();
 
 	const modalRegistry: Record<string, ModalComponent> = {
 		[MODAL_INSTALL_FROM_FILE]: { ref: InstallFromFile },
 		[MODAL_INSTALL_KANDO]: { ref: InstallKando },
-		[MODAL_ADD_PUBLISHER]: { ref: AddPublisher },
 		[MODAL_DEVHUB_INSTALLATION_CONFIRMATION]: { ref: DevHubInstallationConfirmation }
 	};