tajniak81andClaude Opus 5.5
7e5e38c921
apps/ui: Warp's design system for Vue 3 + Tailwind v4. Tokens, fonts, icons and logo come from the brand package, with a Tailwind theme on the tokens and Vue components on the brand component styles. apps/admin: the admin panel as a separate, optional service. warp-admin embeds the built Vue app and proxies only the login endpoints and /_warp/admin/v1 to the homeserver. Pages: dashboard, users, rooms, federation, registration and tokens, server notices, application services, audit log. Also: pnpm workspace, go.work entry, Dockerfile, an `admin` compose profile, Makefile targets, a CI job with a proxy smoke test, and docs. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
27 lines
1.0 KiB
Vue
27 lines
1.0 KiB
Vue
<script setup lang="ts">
|
||
import { computed } from 'vue'
|
||
import { WButton } from '@warp/ui'
|
||
import { formatNumber } from '@/lib/format'
|
||
|
||
const props = defineProps<{ total: number; limit: number; offset: number; noun: string }>()
|
||
const emit = defineEmits<{ go: [offset: number] }>()
|
||
|
||
const from = computed(() => (props.total === 0 ? 0 : props.offset + 1))
|
||
const to = computed(() => Math.min(props.offset + props.limit, props.total))
|
||
</script>
|
||
|
||
<template>
|
||
<div class="mt-3 flex flex-wrap items-center gap-3">
|
||
<p class="small flex-1 text-ink-muted">
|
||
<template v-if="total === 0">No {{ noun }}</template>
|
||
<template v-else>{{ formatNumber(from) }}–{{ formatNumber(to) }} of {{ formatNumber(total) }} {{ noun }}</template>
|
||
</p>
|
||
<div class="flex gap-2">
|
||
<WButton size="sm" icon="chevron-left" :disabled="offset === 0" @click="emit('go', Math.max(0, offset - limit))">
|
||
Previous
|
||
</WButton>
|
||
<WButton size="sm" :disabled="offset + limit >= total" @click="emit('go', offset + limit)">Next</WButton>
|
||
</div>
|
||
</div>
|
||
</template>
|