CI / Test (ubuntu-latest) (push) Canceled after 0s
CI / Test (windows-latest) (push) Canceled after 0s
CI / Storage tests on PostgreSQL (push) Canceled after 0s
CI / Complement (federation off) (push) Canceled after 0s
CI / golangci-lint (push) Canceled after 0s
CI / Smoke test the binary (push) Canceled after 0s
CI / Admin panel (push) Canceled after 0s
CI / Web client (push) Canceled after 0s
apps/web: a Matrix client for the browser on Vue 3, Tailwind and matrix-js-sdk, built on @warp/ui. Like the admin panel it is an optional, separate service: warp-web embeds the built app, serves /config.json and proxies only /_matrix/client and /_matrix/media to the homeserver (or, with -public-homeserver, lets the browser call it directly). Sign-in and sign-up with registration tokens, room list, timeline with back-pagination, text, images, video and files over authenticated media, local echo with sent/read/failed states, receipts, typing, invites, creating, joining and leaving rooms, room info, settings, phone layout. End-to-end encryption through the Rust crypto: encrypted messages and files, emoji verification, key backup setup and restore. apps/ui: WRoomItem, WMessageBubble and WComposer from the brand package, and the icons the client needs. syncapi fixes found with the client: - A room joined inside the sync window was sent as the join alone with limited: false, so clients thought they had the whole room. It is now read like an initial sync; a profile change is not mistaken for a join. - A live typing notification was reported on every sync, so every long poll returned at once while anybody typed. Typing now has a position in the sync token and is reported when it changes, including the empty list when the last person stops. Also: Dockerfile, a `web` compose profile, Makefile targets, a CI job with a proxy smoke test, docs. PLAN.md moves out of the repository. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
44 lines
1.7 KiB
Vue
44 lines
1.7 KiB
Vue
<script setup lang="ts">
|
||
import { onBeforeUnmount, onMounted, ref } from 'vue'
|
||
import { WIconButton, WSpinner } from '@warp/ui'
|
||
import { downloadMedia, useMedia, type MediaSource } from '@/matrix/media'
|
||
|
||
// A full-screen view of one image, closed with Escape or a click outside.
|
||
|
||
const props = defineProps<{ source: MediaSource; name: string }>()
|
||
const emit = defineEmits<{ close: [] }>()
|
||
|
||
const { url, failed } = useMedia(() => props.source)
|
||
const closeBtn = ref<HTMLElement>()
|
||
|
||
function onKey(e: KeyboardEvent) {
|
||
if (e.key === 'Escape') emit('close')
|
||
}
|
||
onMounted(() => {
|
||
document.addEventListener('keydown', onKey)
|
||
closeBtn.value?.querySelector('button')?.focus()
|
||
})
|
||
onBeforeUnmount(() => document.removeEventListener('keydown', onKey))
|
||
</script>
|
||
|
||
<template>
|
||
<div
|
||
class="fixed inset-0 z-50 flex flex-col bg-[#0f1213e6]"
|
||
role="dialog"
|
||
aria-modal="true"
|
||
:aria-label="name"
|
||
@click.self="emit('close')"
|
||
>
|
||
<div class="flex items-center gap-2 p-2 text-[#eceeee]">
|
||
<p class="body-strong min-w-0 flex-1 truncate px-2">{{ name }}</p>
|
||
<WIconButton icon="download" label="Download" class="text-[#eceeee] hover:bg-[#ffffff1a]" @click="downloadMedia(source, name)" />
|
||
<span ref="closeBtn"><WIconButton icon="close" label="Close" class="text-[#eceeee] hover:bg-[#ffffff1a]" @click="emit('close')" /></span>
|
||
</div>
|
||
<div class="flex min-h-0 flex-1 items-center justify-center p-4" @click.self="emit('close')">
|
||
<img v-if="url" :src="url" :alt="name" class="max-h-full max-w-full object-contain" />
|
||
<p v-else-if="failed" class="body text-[#eceeee]">Can’t load the image.</p>
|
||
<WSpinner v-else :size="32" />
|
||
</div>
|
||
</div>
|
||
</template>
|