Your avatar on the dashboard and the Account screen (closes #13) db00632a61d6

package io.oxygenhub.android.api

/**

 * An account's picture as the hub serves it at `/avatar/{name}`: the

 * picture its owner uploaded, or else the identicon the hub draws from the

 * name. The identicon comes as SVG, which Android cannot draw by itself, so

 * it is read into its hue and cells and drawn natively.

 */

sealed interface Avatar {

    /** An uploaded PNG or JPEG, as served. */

    class Picture(val bytes: ByteArray) : Avatar

    /**

     * The hub's identicon: on a 7 by 7 field of the hue at 45% saturation and

     * 92% lightness, the [cells] (x, y, each 1 to 5) at 65% and 45%.

     */

    data class Identicon(val hue: Int, val cells: Set<Pair<Int, Int>>) : Avatar

    companion object {

        private val FIELD = Regex("""<rect width="7" height="7" fill="hsl\((\d{1,3}),45%,92%\)"/>""")

        private val CELL = Regex("""<rect x="([1-5])" y="([1-5])" width="1" height="1"/>""")

        /**

         * The answer to `/avatar/{name}` by its media type; null for what this

         * app cannot draw (a system account's own mark, or anything unexpected),

         * which then shows as the name's initial.

         */

        fun parse(contentType: String?, bytes: ByteArray): Avatar? =

            when (contentType?.substringBefore(';')?.trim()?.lowercase()) {

                "image/png", "image/jpeg" -> if (bytes.isEmpty()) null else Picture(bytes)

                "image/svg+xml" -> identicon(bytes.decodeToString())

                else -> null

            }

        /** The identicon in the hub's SVG, or null when the SVG is not one. */

        fun identicon(svg: String): Identicon? {

            val hue = FIELD.find(svg)?.groupValues?.get(1)?.toIntOrNull()?.takeIf { it < 360 } ?: return null

            val cells = CELL.findAll(svg).map { it.groupValues[1].toInt() to it.groupValues[2].toInt() }.toSet()

            return Identicon(hue, cells)

        }

    }

}

package io.oxygenhub.android.ui.common

import android.graphics.BitmapFactory

import androidx.compose.foundation.Canvas

import androidx.compose.foundation.Image

import androidx.compose.foundation.layout.Box

import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.foundation.layout.size

import androidx.compose.foundation.shape.CircleShape

import androidx.compose.material3.MaterialTheme

import androidx.compose.material3.Surface

import androidx.compose.material3.Text

import androidx.compose.runtime.Composable

import androidx.compose.runtime.getValue

import androidx.compose.runtime.produceState

import androidx.compose.runtime.remember

import androidx.compose.ui.Alignment

import androidx.compose.ui.Modifier

import androidx.compose.ui.draw.clip

import androidx.compose.ui.geometry.Offset

import androidx.compose.ui.geometry.Size

import androidx.compose.ui.graphics.Color

import androidx.compose.ui.graphics.asImageBitmap

import androidx.compose.ui.layout.ContentScale

import androidx.compose.ui.semantics.contentDescription

import androidx.compose.ui.semantics.semantics

import androidx.compose.ui.unit.Dp

import androidx.compose.ui.unit.dp

import io.oxygenhub.android.api.Avatar

import io.oxygenhub.android.api.HubApi

import kotlinx.coroutines.CancellationException

import java.util.concurrent.ConcurrentHashMap

/** Avatars already fetched this run, by account name: each screen shows the last one at once. */

object Avatars {

    private val known = ConcurrentHashMap<String, Avatar>()

    fun cached(name: String): Avatar? = known[name.lowercase()]

    /** Fetch `name`'s avatar again; on a failure the one fetched before, if any. */

    suspend fun load(api: HubApi, name: String): Avatar? {

        val fresh = try {

            api.avatar(name)

        } catch (e: CancellationException) {

            throw e

        } catch (_: Exception) {

            return cached(name)

        }

        if (fresh == null) known.remove(name.lowercase()) else known[name.lowercase()] = fresh

        return fresh

    }

}

/** `name`'s avatar: the cached one first, then the hub's. */

@Composable

fun rememberAvatar(api: HubApi, name: String): Avatar? {

    val avatar by produceState(Avatars.cached(name), api, name) { value = Avatars.load(api, name) }

    return avatar

}

/**

 * An account's avatar in a circle: its picture, the hub's identicon drawn

 * cell by cell, or its initial while there is neither.

 */

@Composable

fun AvatarImage(avatar: Avatar?, name: String, modifier: Modifier = Modifier, size: Dp = 40.dp) {

    val described = modifier.size(size).clip(CircleShape).semantics { contentDescription = "$name's avatar" }

    when (avatar) {

        is Avatar.Picture -> {

            val bitmap = remember(avatar) {

                BitmapFactory.decodeByteArray(avatar.bytes, 0, avatar.bytes.size)?.asImageBitmap()

            }

            if (bitmap == null) {

                Initial(name, size, described)

            } else {

                Image(bitmap, contentDescription = null, contentScale = ContentScale.Crop, modifier = described)

            }

        }

        is Avatar.Identicon -> Canvas(described) {

            // The hub's 7 by 7 field, so the pattern has the same margin.

            val cell = this.size.width / 7f

            drawRect(Color.hsl(avatar.hue.toFloat(), 0.45f, 0.92f))

            val ink = Color.hsl(avatar.hue.toFloat(), 0.65f, 0.45f)

            for ((x, y) in avatar.cells) {

                drawRect(ink, topLeft = Offset(x * cell, y * cell), size = Size(cell, cell))

            }

        }

        null -> Initial(name, size, described)

    }

}

@Composable

private fun Initial(name: String, size: Dp, modifier: Modifier) {

    Surface(modifier, color = MaterialTheme.colorScheme.primaryContainer) {

        Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {

            Text(

                name.take(1).uppercase(),

                style = if (size >= 56.dp) MaterialTheme.typography.headlineMedium else MaterialTheme.typography.titleMedium,

                color = MaterialTheme.colorScheme.onPrimaryContainer,

            )

        }

    }

}

package io.oxygenhub.android.api

import io.oxygenhub.android.Fixtures

import org.junit.Assert.assertEquals

import org.junit.Assert.assertNull

import org.junit.Assert.assertTrue

import org.junit.Test

class AvatarTest {

    @Test

    fun theHubsIdenticonIsReadIntoItsHueAndCells() {

        // As oxygenhub.io served /avatar/bob (2026-10-25).

        val a = Avatar.parse("image/svg+xml", Fixtures.text("identicon-bob.svg").toByteArray()) as Avatar.Identicon

        assertEquals(196, a.hue)

        assertEquals(16, a.cells.size)

        assertTrue((3 to 2) in a.cells && (1 to 5) in a.cells && (5 to 5) in a.cells)

        // Every cell has its mirror image, as the hub draws them.

        for ((x, y) in a.cells) assertTrue("($x,$y) has no mirror", (6 - x to y) in a.cells)

    }

    @Test

    fun anUploadedPictureIsKeptAsItCame() {

        val png = byteArrayOf(0x89.toByte(), 0x50, 0x4E, 0x47)

        val a = Avatar.parse("image/png", png) as Avatar.Picture

        assertTrue(a.bytes.contentEquals(png))

        assertTrue(Avatar.parse("image/jpeg; charset=binary", png) is Avatar.Picture)

    }

    @Test

    fun whatTheAppCannotDrawIsNoAvatar() {

        // A system account's own mark is SVG, but not the identicon.

        assertNull(Avatar.parse("image/svg+xml", "<svg><circle r=\"3\"/></svg>".toByteArray()))

        assertNull(Avatar.parse("text/html", "<html>".toByteArray()))

        assertNull(Avatar.parse(null, ByteArray(3)))

        assertNull(Avatar.parse("image/png", ByteArray(0)))

    }

}

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 7 7" shape-rendering="crispEdges"><rect width="7" height="7" fill="hsl(196,45%,92%)"/><g fill="hsl(196,65%,45%)"><rect x="1" y="1" width="1" height="1"/><rect x="5" y="1" width="1" height="1"/><rect x="2" y="2" width="1" height="1"/><rect x="4" y="2" width="1" height="1"/><rect x="3" y="2" width="1" height="1"/><rect x="1" y="3" width="1" height="1"/><rect x="5" y="3" width="1" height="1"/><rect x="2" y="3" width="1" height="1"/><rect x="4" y="3" width="1" height="1"/><rect x="3" y="3" width="1" height="1"/><rect x="1" y="4" width="1" height="1"/><rect x="5" y="4" width="1" height="1"/><rect x="1" y="5" width="1" height="1"/><rect x="5" y="5" width="1" height="1"/><rect x="2" y="5" width="1" height="1"/><rect x="4" y="5" width="1" height="1"/></g></svg>

- **Your avatar (#13):** the dashboard's greeting and the Account screen show the signed-in account's avatar from the hub's `/avatar/{name}`: an uploaded picture as it is, or the hub's identicon, read from its SVG (hue and cells) and drawn natively, so no SVG library; the initial while there is neither, or the hub cannot be reached. Fetched without the token (it is public), kept for the run, and refreshed with the dashboard.

- **The keyboard no longer comes up on its own on Repositories (#12):** opening Repositories gave the filter focus and brought the keyboard up on every visit (tapping the navigation bar gives the app's view focus, which Compose hands to the screen's first focusable). The filter now takes focus only when it is touched, or reached from a keyboard. Checked on a Pixel 10 Pro Fold.

* 🏠 **Dashboard:** a greeting with your avatar, your newest repositories,

  the unread count. Your avatar is the picture you uploaded to the hub, or

  the hub's identicon for you (#13).

    /** An account's picture (`/avatar/{name}`, public); null when the hub has none this app can draw. */

    suspend fun avatar(name: String): Avatar?

    private val root: HttpUrl = "${hub.trimEnd('/')}/".toHttpUrl()

    }

    override suspend fun avatar(name: String): Avatar? {

        val url = root.newBuilder().addPathSegment("avatar").addPathSegment(name).build()

        // A public picture: no token goes with it.

        val response = try {

            http.newCall(Request.Builder().url(url).get().build()).await()

        } catch (e: IOException) {

            throw HubException.Network(e)

        }

        response.use { r ->

            if (r.code == 404) return null

            val bytes = try {

                r.body?.bytes() ?: ByteArray(0)

            } catch (e: IOException) {

                throw HubException.Network(e)

            }

            if (!r.isSuccessful) throw HubException.Http(r.code, errorDetail(bytes.decodeToString()))

            return Avatar.parse(r.header("Content-Type"), bytes)

        }

import io.oxygenhub.android.api.Avatar

import io.oxygenhub.android.ui.common.AvatarImage

fun AccountScreen(session: Session, avatar: Avatar?, nativeCore: () -> String, onSignOut: suspend () -> Unit) {

                    AvatarImage(avatar, session.username, size = 72.dp)

import androidx.compose.ui.Alignment

import io.oxygenhub.android.ui.common.AvatarImage

            Row(verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(12.dp)) {

                AvatarImage(d.avatar, d.username, size = 48.dp)

                Text(d.greeting, style = MaterialTheme.typography.headlineMedium, fontWeight = FontWeight.Bold)

            }

import io.oxygenhub.android.api.Avatar

import io.oxygenhub.android.ui.common.Avatars

    /** The account's avatar (#13), or null while the hub has none this app can draw. */

    val avatar: Avatar? = null,

    /** Whose avatar: the signed-in account's name. */

    val username: String = "",

        // As is the avatar: its failure leaves the last one, or the initial.

        val avatar = async { Avatars.load(api, session.username) }

            avatar = avatar.await(),

            username = username,

import io.oxygenhub.android.ui.common.rememberAvatar

            composable<AccountRoute> { AccountScreen(session, rememberAvatar(api, session.username), nativeCore, onSignOut) }

import io.oxygenhub.android.api.Avatar

    var avatar: (String) -> Avatar? = { null }

    override suspend fun avatar(name: String): Avatar? = avatar.invoke(name).also { calls += "avatar $name" }

import org.junit.Assert.assertNull

    fun anAvatarIsFetchedWithoutTheToken() = runTest {

        server.enqueue(MockResponse().setHeader("Content-Type", "image/svg+xml").setBody(Fixtures.text("identicon-bob.svg")))

        val a = client().avatar("bob")

        assertEquals(196, (a as Avatar.Identicon).hue)

        val req = server.takeRequest()

        assertEquals("/avatar/bob", req.path)

        assertNull(req.getHeader("Authorization"))

        server.enqueue(MockResponse().setResponseCode(404))

        assertNull(client().avatar("nobody"))

        assertEquals(0, unauthorized)

    }

    @Test

import io.oxygenhub.android.api.Avatar

    fun showsTheAccountsAvatarAndKeepsItWhenTheHubFails() {

        val mine = Avatar.Identicon(196, setOf(3 to 3))

        api.avatar = { if (it == "andymccall") mine else null }

        val vm = DashboardViewModel(api, session) { 9 }

        assertEquals(mine, ready(vm).avatar)

        assertEquals("andymccall", ready(vm).username)

        // A failed fetch keeps the one before; the page still loads.

        api.avatar = { throw HubException.Http(500, "down") }

        vm.refresh()

        assertEquals(mine, ready(vm).avatar)

    }

    @Test