feat: make canister stop start generic (#317)

src/frontend/src/lib/components/satellites/SatelliteStart.svelte → src/frontend/src/lib/components/canister/CanisterStart.svelte

@@ -1,16 +1,20 @@
 <script lang="ts">
 	import { i18n } from '$lib/stores/i18n.store';
 	import Confirmation from '$lib/components/core/Confirmation.svelte';
-	import type { Satellite } from '$declarations/mission_control/mission_control.did';
 	import { authSignedInStore, authStore } from '$lib/stores/auth.store';
 	import { toasts } from '$lib/stores/toasts.store';
 	import { busy } from '$lib/stores/busy.store';
 	import { canisterStart } from '$lib/api/ic.api';
 	import { emit } from '$lib/utils/events.utils';
 	import IconStart from '$lib/components/icons/IconStart.svelte';
 	import { createEventDispatcher } from 'svelte';
+	import type { Canister } from '$lib/types/canister';
+	import { Principal } from '@dfinity/principal';
+	import { i18nCapitalize, i18nFormat } from '$lib/utils/i18n.utils';
+	import Text from '$lib/components/ui/Text.svelte';
 
-	export let satellite: Satellite;
+	export let canister: Canister;
+	export let segment: 'satellite' | 'orbiter';
 
 	let visible = false;
 
@@ -29,17 +33,28 @@
 		busy.start();
 
 		try {
-			await canisterStart({ canisterId: satellite.satellite_id, identity: $authStore.identity! });
+			const canisterId = Principal.fromText(canister.id);
 
-			emit({ message: 'junoRestartCycles', detail: { canisterId: satellite.satellite_id } });
+			await canisterStart({ canisterId, identity: $authStore.identity! });
+
+			emit({ message: 'junoRestartCycles', detail: { canisterId } });
 			emit({ message: 'junoReloadVersions' });
 
 			close();
 
-			toasts.success($i18n.satellites.start_success);
+			toasts.success(
+				i18nCapitalize(
+					i18nFormat($i18n.canisters.start_success, [
+						{
+							placeholder: '{0}',
+							value: segment
+						}
+					])
+				)
+			);
 		} catch (err: unknown) {
 			toasts.error({
-				text: $i18n.errors.satellite_start,
+				text: $i18n.errors.canister_start,
 				detail: err
 			});
 		}
@@ -53,7 +68,9 @@
 <button on:click={() => (visible = true)} class="menu"><IconStart /> {$i18n.core.start}</button>
 
 <Confirmation bind:visible on:junoYes={start} on:junoNo={close}>
-	<svelte:fragment slot="title">{$i18n.satellites.start_tile}</svelte:fragment>
+	<svelte:fragment slot="title">
+		<Text key="canisters.start_tile" value={segment} /></svelte:fragment
+	>
 
-	<p>{$i18n.satellites.start_info}</p>
+	<p><Text key="canisters.start_info" value={segment} /></p>
 </Confirmation>

src/frontend/src/lib/components/satellites/SatelliteStop.svelte → src/frontend/src/lib/components/canister/CanisterStop.svelte

@@ -4,13 +4,17 @@
 	import { busy } from '$lib/stores/busy.store';
 	import { toasts } from '$lib/stores/toasts.store';
 	import { canisterStop } from '$lib/api/ic.api';
-	import type { Satellite } from '$declarations/mission_control/mission_control.did';
 	import { authSignedInStore, authStore } from '$lib/stores/auth.store';
 	import { emit } from '$lib/utils/events.utils';
 	import IconStop from '$lib/components/icons/IconStop.svelte';
 	import { createEventDispatcher } from 'svelte';
+	import type { Canister } from '$lib/types/canister';
+	import { Principal } from '@dfinity/principal';
+	import { i18nCapitalize, i18nFormat } from '$lib/utils/i18n.utils';
+	import Text from '$lib/components/ui/Text.svelte';
 
-	export let satellite: Satellite;
+	export let canister: Canister;
+	export let segment: 'satellite' | 'orbiter';
 
 	let visible = false;
 
@@ -29,16 +33,27 @@
 		busy.start();
 
 		try {
-			await canisterStop({ canisterId: satellite.satellite_id, identity: $authStore.identity! });
+			const canisterId = Principal.fromText(canister.id);
 
-			emit({ message: 'junoRestartCycles', detail: { canisterId: satellite.satellite_id } });
+			await canisterStop({ canisterId, identity: $authStore.identity! });
+
+			emit({ message: 'junoRestartCycles', detail: { canisterId } });
 
 			close();
 
-			toasts.success($i18n.satellites.stop_success);
+			toasts.success(
+				i18nCapitalize(
+					i18nFormat($i18n.canisters.stop_success, [
+						{
+							placeholder: '{0}',
+							value: segment
+						}
+					])
+				)
+			);
 		} catch (err: unknown) {
 			toasts.error({
-				text: $i18n.errors.satellite_stop,
+				text: $i18n.errors.canister_stop,
 				detail: err
 			});
 		}
@@ -52,11 +67,12 @@
 <button on:click={() => (visible = true)} class="menu"><IconStop /> {$i18n.core.stop}</button>
 
 <Confirmation bind:visible on:junoYes={stop} on:junoNo={close}>
-	<svelte:fragment slot="title">{$i18n.satellites.stop_title}</svelte:fragment>
+	<svelte:fragment slot="title"><Text key="canisters.stop_title" value={segment} /></svelte:fragment
+	>
 
-	<p>{$i18n.satellites.stop_explanation}</p>
+	<p><Text key="canisters.stop_explanation" value={segment} /></p>
 
-	<p>{$i18n.satellites.stop_error}</p>
+	<p><Text key="canisters.stop_error" value={segment} /></p>
 
-	<p>{$i18n.satellites.stop_info}</p>
+	<p><Text key="canisters.stop_info" value={segment} /></p>
 </Confirmation>

src/frontend/src/lib/components/canister/CanisterStopStart.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+	import type { Canister, CanisterStatus, CanisterSyncStatus } from '$lib/types/canister';
+	import CanisterStart from '$lib/components/canister/CanisterStart.svelte';
+	import CanisterStop from '$lib/components/canister/CanisterStop.svelte';
+	import { fade } from 'svelte/transition';
+	import { nonNullish } from '@dfinity/utils';
+
+	export let canister: Canister | undefined = undefined;
+	export let segment: 'satellite' | 'orbiter';
+
+	let status: CanisterStatus | undefined = undefined;
+	let sync: CanisterSyncStatus | undefined = undefined;
+
+	$: status = canister?.data?.status;
+	$: sync = canister?.sync;
+</script>
+
+{#if nonNullish(canister) && status === 'stopped' && sync === 'synced'}
+	<div in:fade><CanisterStart {canister} {segment} /></div>
+{:else if nonNullish(canister) && status === 'running' && sync === 'synced'}
+	<div in:fade><CanisterStop {canister} {segment} /></div>
+{/if}
+
+<style lang="scss">
+	div {
+		display: inline-block;
+	}
+</style>

src/frontend/src/lib/components/modals/CanisterDeleteModal.svelte

@@ -94,7 +94,7 @@
 			steps = 'error';
 
 			toasts.error({
-				text: $i18n.errors.satellite_delete,
+				text: $i18n.errors.canister_delete,
 				detail: err
 			});
 		}

src/frontend/src/lib/components/satellites/SatelliteActions.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { Satellite } from '$declarations/mission_control/mission_control.did';
 	import TopUp from '$lib/components/canister/TopUp.svelte';
-	import SatelliteStopStart from '$lib/components/satellites/SatelliteStopStart.svelte';
+	import CanisterStopStart from '$lib/components/canister/CanisterStopStart.svelte';
 	import SatelliteDelete from '$lib/components/satellites/SatelliteDelete.svelte';
 	import type { Canister } from '$lib/types/canister';
 	import Actions from '$lib/components/core/Actions.svelte';
@@ -36,7 +36,7 @@
 		on:junoDelete={close}
 	/>
 
-	<SatelliteStopStart {satellite} {canister} />
+	<CanisterStopStart {canister} segment="satellite" />
 
 	<SatelliteDelete {satellite} {canister} />
 </Actions>

src/frontend/src/lib/components/ui/Text.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+	import { i18nFormat, i18nText } from '$lib/utils/i18n.utils';
+	import { i18n } from '$lib/stores/i18n.store';
+
+	export let key: string;
+	export let value: string;
+	export let placeholder = '{0}';
+</script>
+
+{@html i18nFormat(i18nText({ i18n: $i18n, labelKey: key }), [
+	{
+		placeholder,
+		value
+	}
+])}

src/frontend/src/lib/i18n/en.json

@@ -66,7 +66,15 @@
 		"cycles_to_retain": "T Cycles to retain",
 		"cycles_to_transfer": "{0} T Cycles will be transferred to your mission control.",
 		"delete_info": "Do you want to delete your {0}? This action is irreversible.",
-		"invalid_cycles_to_retain": "Invalid amount of cycles to retain"
+		"invalid_cycles_to_retain": "Invalid amount of cycles to retain",
+		"stop_title": "Stop {0}",
+		"stop_info": "Do you want to stop your {0}?",
+		"stop_explanation": "Please note that a stopped {0} continues to consume cycles for the memory it occupies, including any remaining outstanding responses, until the cycle balance reaches 0. After that, it will be deleted.",
+		"stop_error": "Additionally, be aware that stopping the {0} may result in error messages being displayed in the console.",
+		"stop_success": "{0} stopped.",
+		"start_tile": "Restart {0}",
+		"start_info": "Do you want to resume your {0}?",
+		"start_success": "{0} resumed."
 	},
 	"sign_in": {
 		"title": "Launch your first satellite",
@@ -93,14 +101,6 @@
 		"loading_satellites": "Loading your satellites",
 		"overview": "Overview",
 		"id": "Satellite ID",
-		"stop_title": "Stop satellite",
-		"stop_info": "Do you want to stop your satellite?",
-		"stop_explanation": "Please note that a stopped satellite continues to consume cycles for the memory it occupies, including any remaining outstanding responses, until the cycle balance reaches 0. After that, it will be deleted.",
-		"stop_error": "Additionally, be aware that stopping the satellite may result in error messages being displayed in the console.",
-		"stop_success": "Satellite stopped.",
-		"start_tile": "Restart satellite",
-		"start_info": "Do you want to resume your satellite?",
-		"start_success": "Satellite resumed.",
 		"delete_success": "Satellite deleted."
 	},
 	"mission_control": {
@@ -230,9 +230,9 @@
 		"satellite_no_found": "Satellite not found. Return to <a href=\"/\">start</a> to find your satellites.",
 		"satellite_name_update": "Unexpected error(s) while trying to rename your satellite.",
 		"satellite_missing_name": "A name must be provided.",
-		"satellite_stop": "Unexpected error(s) while trying to stop the satellite",
-		"satellite_start": "Unexpected error(s) while trying to start the satellite",
-		"satellite_delete": "Unexpected error(s) while trying to delete the satellite",
+		"canister_stop": "Unexpected error(s) while trying to stop the smart contract",
+		"canister_start": "Unexpected error(s) while trying to start the smart contract",
+		"canister_delete": "Unexpected error(s) while trying to delete the smart contract",
 		"ledger_balance_credits": "Unexpected error(s) while getting your mission control balance and credits.",
 		"load_credits": "Cannot load your current credits status.",
 		"hosting_missing_domain_name": "A domain name must be provided.",

src/frontend/src/lib/i18n/it.json

@@ -66,7 +66,15 @@
 		"cycles_to_retain": "T Cycles to retain",
 		"cycles_to_transfer": "{0} T Cycles will be transferred to your mission control.",
 		"delete_info": "Do you want to delete your {0}? This action is irreversible.",
-		"invalid_cycles_to_retain": "Invalid amount of cycles to retain"
+		"invalid_cycles_to_retain": "Invalid amount of cycles to retain",
+		"stop_title": "Stop {0}",
+		"stop_info": "Do you want to stop your {0}?",
+		"stop_explanation": "Please note that a stopped {0} continues to consume cycles for the memory it occupies, including any remaining outstanding responses, until the cycle balance reaches 0. After that, it will be deleted.",
+		"stop_error": "Additionally, be aware that stopping the {0} may result in error messages being displayed in the console.",
+		"stop_success": "{0} stopped.",
+		"start_tile": "Restart {0}",
+		"start_info": "Do you want to resume your {0}?",
+		"start_success": "{0} resumed."
 	},
 	"sign_in": {
 		"title": "Lancia il tuo primo satellite",
@@ -93,14 +101,6 @@
 		"loading_satellites": "Caricando i tuoi satelliti",
 		"overview": "Panoramica",
 		"id": "Satellite ID",
-		"stop_title": "Stop satellite",
-		"stop_info": "Do you want to stop your satellite?",
-		"stop_explanation": "Please note that a stopped satellite continues to consume cycles for the memory it occupies, including any remaining outstanding responses, until the cycle balance reaches 0. After that, it will be deleted.",
-		"stop_error": "Additionally, be aware that stopping the satellite may result in error messages being displayed in the console.",
-		"stop_success": "Satellite stopped.",
-		"start_tile": "Restart satellite",
-		"start_info": "Do you want to resume your satellite?",
-		"start_success": "Satellite resumed.",
 		"delete_success": "Satellite deleted."
 	},
 	"mission_control": {
@@ -230,9 +230,9 @@
 		"satellite_no_found": "Satellite non trovato.Torna all'<a href=\"/\">inizio</a> per trovare i tuoi satelliti.",
 		"satellite_name_update": "Unexpected error(s) while trying to rename your satellite.",
 		"satellite_missing_name": "A name must be provided.",
-		"satellite_stop": "Unexpected error(s) while trying to stop the satellite",
-		"satellite_start": "Unexpected error(s) while trying to start the satellite",
-		"satellite_delete": "Unexpected error(s) while trying to delete the satellite",
+		"canister_stop": "Unexpected error(s) while trying to stop the smart contract",
+		"canister_start": "Unexpected error(s) while trying to start the smart contract",
+		"canister_delete": "Unexpected error(s) while trying to delete the smart contract",
 		"ledger_balance_credits": "Errore/i imprevisto/i durante il caricamento del saldo del tuo mission control e dei crediti.",
 		"load_credits": "Cannot load your current credits status.",
 		"hosting_missing_domain_name": "E' obbligatorio scegliere un nome a dominio",

src/frontend/src/lib/i18n/zh-cn.json

@@ -66,7 +66,15 @@
 		"cycles_to_retain": "T Cycles to retain",
 		"cycles_to_transfer": "{0} T Cycles will be transferred to your mission control.",
 		"delete_info": "Do you want to delete your {0}? This action is irreversible.",
-		"invalid_cycles_to_retain": "Invalid amount of cycles to retain"
+		"invalid_cycles_to_retain": "Invalid amount of cycles to retain",
+		"stop_title": "停止 {0}",
+		"stop_info": "确认要停止你的 {0}?",
+		"stop_explanation": "请注意，停止的{0}仍然会消耗cycles用于内存的使用，包括其他必要的响应知道cycle归零，之后它将会被删除",
+		"stop_error": "此外，停止的{0}可能导致控制台显示错误",
+		"stop_success": "{0} 已停止.",
+		"start_tile": "重启 {0}",
+		"start_info": "你想恢复你的 {0}?",
+		"start_success": "{0} 已恢复."
 	},
 	"sign_in": {
 		"title": "创建你的第一个satellite",
@@ -93,14 +101,6 @@
 		"loading_satellites": "加载你的satellites",
 		"overview": "概要",
 		"id": "Satellite ID",
-		"stop_title": "停止 satellite",
-		"stop_info": "确认要停止你的 satellite?",
-		"stop_explanation": "请注意，停止的satellite仍然会消耗cycles用于内存的使用，包括其他必要的响应知道cycle归零，之后它将会被删除",
-		"stop_error": "此外，停止的satellate可能导致控制台显示错误",
-		"stop_success": "Satellite 已停止.",
-		"start_tile": "重启 satellite",
-		"start_info": "你想恢复你的 satellite?",
-		"start_success": "Satellite 已恢复.",
 		"delete_success": "Satellite deleted."
 	},
 	"mission_control": {
@@ -230,9 +230,9 @@
 		"satellite_no_found": "Satellite没找到，返回 <a href=\"/\">开始</a>去找你的 satellites.",
 		"satellite_name_update": "试图修改你的 satellite 名字出现异常.",
 		"satellite_missing_name": "必须提供一个名字.",
-		"satellite_stop": "停止 satellite 中遇到异常错误",
-		"satellite_start": "启动 satellite 过程中遇到异常错误",
-		"satellite_delete": "Unexpected error(s) while trying to delete the satellite",
+		"canister_stop": "停止 smart contract 中遇到异常错误",
+		"canister_start": "启动 smart contract 过程中遇到异常错误",
+		"canister_delete": "Unexpected error(s) while trying to delete the smart contract",
 		"ledger_balance_credits": "获取你的 mission control 余额和积分时出现未知错误.",
 		"load_credits": "无法加载你当前credit状态.",
 		"hosting_missing_domain_name": "必须提供一个域名.",