fix: change default babbles name and avatar (#501)

src/lib/adapters/waku/index.ts

@@ -484,9 +484,11 @@ export default class WakuAdapter implements Adapter {
 		this.subscriptions.push(subscribeInstalledObjectStore)
 
 		// subscribe to default Babbles
-		const defaultBabblesId = '0fbc5ad135290633aab3f37e5e0529fefa3c77cd9122b9a9e814bc8622e44d3f'
+		const defaultBabblesId = '67de48e09e52efce6a5f01197259c648412129dddc578bb2d6888aa69e2fed4c'
 		if (!get(chats).chats.has(defaultBabblesId)) {
-			await this.startBabbles(wallet, defaultBabblesId, 'Babbles')
+			const defaultBabblesName = 'Cypher City'
+			const defaultBabblesAvatar = 'QmeQQ1RSav1ysrNoM4hpyKTEXKQ3bAt1keHU6MCkJNKScx'
+			await this.startBabbles(wallet, defaultBabblesId, defaultBabblesName, defaultBabblesAvatar)
 		}
 
 		// deferred updates

src/routes/babbles/chat/[id]/edit/+page.svelte

@@ -1,28 +1,20 @@
 <script lang="ts">
 	import ChevronLeft from '$lib/components/icons/chevron-left.svelte'
 	import Checkmark from '$lib/components/icons/checkmark.svelte'
-	import Renew from '$lib/components/icons/renew.svelte'
 
 	import Button from '$lib/components/button.svelte'
 	import Header from '$lib/components/header.svelte'
 	import Container from '$lib/components/container.svelte'
-	import InputField from '$lib/components/input-field.svelte'
 	import AuthenticatedOnly from '$lib/components/authenticated-only.svelte'
 	import Layout from '$lib/components/layout.svelte'
 	import Divider from '$lib/components/divider.svelte'
-	import Avatar from '$lib/components/avatar.svelte'
-	import InputFile from '$lib/components/input-file.svelte'
 
 	import { chats } from '$lib/stores/chat'
-	import { clipAndResize } from '$lib/utils/image'
 	import { page } from '$app/stores'
 	import { goto } from '$app/navigation'
-	import { uploadPicture } from '$lib/adapters/ipfs'
-	import { onDestroy } from 'svelte'
 	import Logout from '$lib/components/icons/logout.svelte'
 	import ROUTES from '$lib/routes'
 	import Loading from '$lib/components/loading.svelte'
-	import { errorStore } from '$lib/stores/error'
 	import CopyLink from '$lib/components/icons/copy-link.svelte'
 	import ReadonlyText from '$lib/components/readonly-text.svelte'
 	import QRCode from '@bonosoft/sveltekit-qrcode'
@@ -31,16 +23,8 @@
 	$: chatId = $page.params.id
 	$: groupChat = $chats.chats.get(chatId)
 	$: shareLink = $page.url.href.replace('/edit', '')
-	let picture: string | undefined
-	let name: string | undefined
-
-	$: if (groupChat) {
-		picture = picture ?? groupChat.avatar
-		name = name ?? groupChat.name
-	}
 
 	const screen = 'settings'
-	let pictureFiles: FileList | undefined = undefined
 	let buttonDisabled = false
 	let copied = false
 
@@ -49,56 +33,6 @@
 		copied = true
 	}
 
-	async function resizePicture(p?: File) {
-		try {
-			picture = p ? await uploadPicture(await clipAndResize(p, 200, 200)) : picture
-		} catch (e) {
-			errorStore.addStart({
-				title: 'Profile Error',
-				message: `Failed to upload profile picture. ${(e as Error)?.message}`,
-				retry: () => resizePicture(p),
-				ok: true,
-			})
-		}
-	}
-	$: resizePicture(pictureFiles && pictureFiles[0])
-
-	$: if (
-		!$chats.loading &&
-		((name && name !== groupChat?.name) || (picture && picture !== groupChat?.avatar))
-	) {
-		debounceSaveProfile()
-	}
-
-	let timer: ReturnType<typeof setTimeout> | undefined
-
-	async function saveProfileNow() {
-		if (!groupChat) {
-			return
-		}
-		chats.updateChat(chatId, (chat) => ({
-			...chat,
-			name: name,
-			avatar: picture,
-		}))
-	}
-
-	// Debounce saving profile
-	function debounceSaveProfile() {
-		if (timer) clearTimeout(timer)
-		timer = setTimeout(() => {
-			saveProfileNow()
-			timer = undefined
-		}, 1000)
-	}
-
-	onDestroy(() => {
-		if (timer) {
-			clearTimeout(timer)
-			saveProfileNow()
-		}
-	})
-
 	function leaveGroup() {
 		chats.removeChat($page.params.id)
 		goto(ROUTES.HOME)
@@ -131,15 +65,6 @@
 					</svelte:fragment>
 				</Header>
 			</svelte:fragment>
-			<Container gap={12}>
-				<Avatar group {picture} seed={chatId} size={140} />
-				<InputFile bind:files={pictureFiles}>
-					<Renew />
-					Change picture
-				</InputFile>
-				<InputField autofocus bind:value={name} label="Group name" />
-			</Container>
-			<Divider padTop={24} />
 			<Container gap={12} justify="flex-start" align="center" padX={24} padY={24}>
 				<p class="text-lg text-bold">Show QR code or share link below</p>
 				<div class="qr">