Merge branch 'feat/contract-migration-ui' of github.com:valory-xyz/ol…

…as-operate-app into feat/win-support

.github/workflows/release.yml

@@ -44,7 +44,7 @@ jobs:
 
         - name: Get trader bin
           run: |
-            trader_version=$(poetry run python -c "import yaml; config = yaml.safe_load(open('templates/trader.yaml')); print(config['trader_version'])")
+            trader_version=$(poetry run python -c "import yaml; config = yaml.safe_load(open('templates/trader.yaml')); print(config['service_version'])")
             echo $trader_version
             mkdir dist && curl -L -o dist/aea_bin "https://github.com/valory-xyz/trader/releases/download/${trader_version}/trader_bin_${{ env.OS_ARCH }}"
 

electron/install.js

@@ -14,7 +14,7 @@ const homedir = os.homedir();
  * - use "" (nothing as a suffix) for latest release candidate, for example "0.1.0rc26"
  * - use "alpha" for alpha release, for example "0.1.0rc26-alpha"
  */
-const OlasMiddlewareVersion = '0.1.0rc111';
+const OlasMiddlewareVersion = '0.1.0rc112';
 
 const path = require('path');
 const { app } = require('electron');

electron/main.js

@@ -198,7 +198,7 @@ const HEIGHT = 700;
 /**
  * Creates the main window
  */
-const createMainWindow = () => {
+const createMainWindow = async () => {
   const width = isDev ? 840 : APP_WIDTH;
   mainWindow = new BrowserWindow({
     title: 'Pearl',
@@ -219,12 +219,6 @@ const createMainWindow = () => {
 
   mainWindow.setMenuBarVisibility(true);
 
-  if (isDev) {
-    mainWindow.loadURL(`http://localhost:${appConfig.ports.dev.next}`);
-  } else {
-    mainWindow.loadURL(`http://localhost:${appConfig.ports.prod.next}`);
-  }
-
   ipcMain.on('close-app', () => {
     mainWindow.close();
   });
@@ -267,15 +261,23 @@ const createMainWindow = () => {
     event.preventDefault();
     mainWindow.hide();
   });
-
-  const storeInitialValues = {
-    environmentName: process.env.IS_STAGING ? 'staging' : '',
-  };
-  setupStoreIpc(ipcMain, mainWindow, storeInitialValues);
+
+  try {
+    logger.electron('Setting up store IPC');
+    await setupStoreIpc(ipcMain, mainWindow);
+  } catch (e) {
+    logger.electron('Store IPC failed:', JSON.stringify(e));
+  }
 
   if (isDev) {
     mainWindow.webContents.openDevTools();
   }
+
+  if (isDev) {
+    mainWindow.loadURL(`http://localhost:${appConfig.ports.dev.next}`);
+  } else {
+    mainWindow.loadURL(`http://localhost:${appConfig.ports.prod.next}`);
+  }
 };
 
 async function launchDaemon() {
@@ -499,7 +501,7 @@ ipcMain.on('check', async function (event, _argument) {
     }
 
     event.sender.send('response', 'Launching App');
-    createMainWindow();
+    await createMainWindow();
     createTray();
     splashWindow.destroy();
   } catch (e) {

electron/store.js

@@ -1,24 +1,23 @@
 // set schema to validate store data
-const defaultSchema = {
-  environmentName: { type: 'string', default: '' },
-  isInitialFunded: { type: 'boolean', default: false },
+const schema = {
+  isInitialFunded: { type: 'boolean', default: false }, // TODO: reconsider this default, can be problematic if user has already funded prior to implementation
   firstStakingRewardAchieved: { type: 'boolean', default: false },
   firstRewardNotificationShown: { type: 'boolean', default: false },
   agentEvictionAlertShown: { type: 'boolean', default: false },
-};
 
-const setupStoreIpc = async (ipcChannel, mainWindow, storeInitialValues) => {
-  const Store = (await import('electron-store')).default;
+  environmentName: { type: 'string', default: '' },
+  currentStakingProgram: { type: 'string', default: '' },
+};
 
-  // set default values for store
-  const schema = Object.assign({}, defaultSchema);
-  Object.keys(schema).forEach((key) => {
-    if (storeInitialValues[key] !== undefined) {
-      schema[key].default = storeInitialValues[key];
-    }
-  });
+/**
+ * Sets up the IPC communication and initializes the Electron store with default values and schema.
+ * @param {Electron.IpcMain} ipcMain - The IPC channel for communication.
+ * @param {Electron.BrowserWindow} mainWindow - The main Electron browser window.
+ * @returns {Promise<void>} - A promise that resolves once the store is set up.
+ */
+const setupStoreIpc = async (ipcMain, mainWindow) => {
+  const Store = (await import("electron-store")).default;
 
-  /** @type import Store from 'electron-store' */
   const store = new Store({ schema });
 
   store.onDidAnyChange((data) => {
@@ -27,11 +26,11 @@ const setupStoreIpc = async (ipcChannel, mainWindow, storeInitialValues) => {
   });
 
   // exposed to electron browser window
-  ipcChannel.handle('store', () => store.store);
-  ipcChannel.handle('store-get', (_, key) => store.get(key));
-  ipcChannel.handle('store-set', (_, key, value) => store.set(key, value));
-  ipcChannel.handle('store-delete', (_, key) => store.delete(key));
-  ipcChannel.handle('store-clear', (_) => store.clear());
+  ipcMain.handle('store', () => store.store);
+  ipcMain.handle('store-get', (_, key) => store.get(key));
+  ipcMain.handle('store-set', (_, key, value) => store.set(key, value));
+  ipcMain.handle('store-delete', (_, key) => store.delete(key));
+  ipcMain.handle('store-clear', (_) => store.clear());  
 };
 
 module.exports = { setupStoreIpc };

frontend/client/types.ts

@@ -1,3 +1,4 @@
+import { StakingProgram } from '@/enums/StakingProgram';
 import { Address } from '@/types/Address';
 
 import { Chain, DeploymentStatus, Ledger } from './enums';
@@ -20,36 +21,53 @@ export type ChainData = {
   instances?: Address[];
   token?: number;
   multisig?: Address;
+  on_chain_state: number;
+  staked: boolean;
+  user_params: {
+    cost_of_bond: number;
+    fund_requirements: {
+      agent: number;
+      safe: number;
+    };
+    nft: string;
+    staking_program_id: StakingProgram;
+    threshold: number;
+    use_staking: true;
+  };
 };
 
 export type Service = {
   name: string;
   hash: string;
   keys: ServiceKeys[];
   readme?: string;
-  ledger: LedgerConfig;
-  chain_data: ChainData;
+  chain_configs: {
+    [chainId: number]: {
+      ledger_config: LedgerConfig;
+      chain_data: ChainData;
+    };
+  };
 };
 
 export type ServiceTemplate = {
   name: string;
   hash: string;
   image: string;
   description: string;
-  configuration: ConfigurationTemplate;
+  service_version: string;
+  home_chain_id: string;
+  configurations: { [key: string]: ConfigurationTemplate };
   deploy?: boolean;
 };
 
 export type ConfigurationTemplate = {
+  rpc?: string; // added on deployment
+  staking_program_id?: StakingProgram; // added on deployment
   nft: string;
-  trader_version: string;
-  rpc?: string; // added by user
   agent_id: number;
   threshold: number;
   use_staking: boolean;
   cost_of_bond: number;
-  olas_cost_of_bond: number;
-  olas_required_to_stake: number;
   monthly_gas_estimate: number;
   fund_requirements: FundRequirementsTemplate;
 };

frontend/components/Alert/AlertTitle.tsx

@@ -0,0 +1,5 @@
+import { Typography } from 'antd';
+
+export const AlertTitle = ({ children }: { children: React.ReactNode }) => (
+  <Typography.Text className="font-weight-600">{children}</Typography.Text>
+);

frontend/components/Alert/index.tsx

@@ -14,7 +14,7 @@ const icons = {
   error: <ExclamationCircleOutlined />,
 };
 
-export const Alert = ({
+export const CustomAlert = ({
   type,
   fullWidth,
   ...rest

frontend/components/HelpAndSupport/index.tsx → frontend/components/HelpAndSupportPage/index.tsx

@@ -4,7 +4,7 @@ import { useCallback, useEffect, useState } from 'react';
 
 import { UNICODE_SYMBOLS } from '@/constants/symbols';
 import { FAQ_URL, SUPPORT_URL } from '@/constants/urls';
-import { PageState } from '@/enums/PageState';
+import { Pages } from '@/enums/PageState';
 import { useElectronApi } from '@/hooks/useElectronApi';
 import { useLogs } from '@/hooks/useLogs';
 import { usePageState } from '@/hooks/usePageState';
@@ -78,7 +78,7 @@ export const HelpAndSupport = () => {
         <Button
           size="large"
           icon={<CloseOutlined />}
-          onClick={() => goto(PageState.Main)}
+          onClick={() => goto(Pages.Main)}
         />
       }
     >

frontend/components/MainPage/MainHeader/FirstRunModal.tsx

@@ -0,0 +1,58 @@
+import { Button, Flex, Modal, Typography } from 'antd';
+import Image from 'next/image';
+import { FC } from 'react';
+
+import { useServiceTemplates } from '@/hooks/useServiceTemplates';
+import { getMinimumStakedAmountRequired } from '@/utils/service';
+
+type FirstRunModalProps = { open: boolean; onClose: () => void };
+
+export const FirstRunModal: FC<FirstRunModalProps> = ({ open, onClose }) => {
+  const { getServiceTemplates } = useServiceTemplates();
+
+  if (!open) return null;
+
+  const minimumStakedAmountRequired = getMinimumStakedAmountRequired(
+    getServiceTemplates()[0],
+  );
+
+  return (
+    <Modal
+      open={open}
+      width={412}
+      onCancel={onClose}
+      footer={[
+        <Button
+          key="ok"
+          type="primary"
+          block
+          size="large"
+          className="mt-8"
+          onClick={onClose}
+        >
+          Got it
+        </Button>,
+      ]}
+    >
+      <Flex align="center" justify="center">
+        <Image
+          src="/splash-robot-head.png"
+          width={100}
+          height={100}
+          alt="OLAS logo"
+        />
+      </Flex>
+      <Typography.Title level={5} className="mt-12 text-center">
+        {`Your agent is running and you've staked ${minimumStakedAmountRequired} OLAS!`}
+      </Typography.Title>
+      <Typography.Paragraph>
+        Your agent is working towards earning rewards.
+      </Typography.Paragraph>
+      <Typography.Paragraph>
+        Pearl is designed to make it easy for you to earn staking rewards every
+        day. Simply leave the app and agent running in the background for ~1hr a
+        day.
+      </Typography.Paragraph>
+    </Modal>
+  );
+};