import { n as head_default, o as vue_exports, s as router } from "../ssr.js";
import { n as server_renderer_exports, t } from "./i18n-CXLOYfyq.js";
import { n as Avatar_default, t as AppLayout_default } from "./AppLayout-DbhjYK6s.js";
//#region resources/js/Pages/Notifications/Index.vue?vue&type=script&setup=true&lang.ts
var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue_exports.defineComponent)({
	__name: "Index",
	__ssrInlineRender: true,
	props: {
		items: {},
		unread: {}
	},
	setup(__props) {
		const props = __props;
		function label(n) {
			if (n.type === "badge") return n.text || t("You earned a badge");
			if (n.type === "trust_level_up") return t("🎉 You reached {level}!", { level: n.label ?? "" });
			if (n.type === "mention") return t("{name} mentioned you in {topic}", {
				name: n.actor?.name ?? "",
				topic: n.topic?.title ?? ""
			});
			if (n.type === "reaction") return t("{name} reacted {emoji} to your post", {
				name: n.actor?.name ?? "",
				emoji: n.emoji ?? ""
			});
			return t("{name} replied in {topic}", {
				name: n.actor?.name ?? "",
				topic: n.topic?.title ?? ""
			});
		}
		function go(n) {
			if (!n.read) router.post(`/notifications/${n.id}/read`, {}, { preserveScroll: true });
			router.visit(n.url);
		}
		function markAll() {
			router.post("/notifications/read", {}, { preserveScroll: true });
		}
		function clearAll() {
			if (!window.confirm(t("Clear all notifications? This cannot be undone."))) return;
			router.delete("/notifications", { preserveScroll: true });
		}
		function clearOne(n) {
			router.delete(`/notifications/${n.id}`, { preserveScroll: true });
		}
		return (_ctx, _push, _parent, _attrs) => {
			_push(`<!--[-->`);
			_push((0, server_renderer_exports.ssrRenderComponent)((0, vue_exports.unref)(head_default), { title: (0, vue_exports.unref)(t)("Notifications") }, null, _parent));
			_push((0, server_renderer_exports.ssrRenderComponent)(AppLayout_default, null, {
				default: (0, vue_exports.withCtx)((_, _push, _parent, _scopeId) => {
					if (_push) {
						_push(`<div class="mx-auto max-w-[760px]"${_scopeId}><div class="mb-5 flex items-center justify-between"${_scopeId}><h1 class="text-2xl font-extrabold tracking-tight"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)((0, vue_exports.unref)(t)("Notifications"))}</h1><div class="flex items-center gap-2"${_scopeId}>`);
						if (props.unread > 0) _push(`<button type="button" class="rounded-lg border border-line bg-surface px-3 py-2 text-sm font-semibold text-ink-2 hover:bg-surface-2"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)((0, vue_exports.unref)(t)("Mark all read"))}</button>`);
						else _push(`<!---->`);
						if (props.items.length) _push(`<button type="button" class="rounded-lg border border-line bg-surface px-3 py-2 text-sm font-semibold text-ink-2 hover:border-red-500/40 hover:text-red-500"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)((0, vue_exports.unref)(t)("Clear all"))}</button>`);
						else _push(`<!---->`);
						_push(`</div></div><div class="overflow-hidden rounded-c border border-line bg-surface"${_scopeId}><!--[-->`);
						(0, server_renderer_exports.ssrRenderList)(props.items, (n) => {
							_push(`<div class="${(0, server_renderer_exports.ssrRenderClass)([!n.read ? "bg-primary/10" : "", "group flex w-full cursor-pointer items-start gap-3 border-b border-line/60 px-5 py-4 text-left last:border-0 hover:bg-surface-2"])}"${_scopeId}>`);
							if (!n.actor) _push(`<div class="grid h-10 w-10 shrink-0 place-items-center rounded-full bg-primary/15 text-xl"${_scopeId}>🎉</div>`);
							else _push((0, server_renderer_exports.ssrRenderComponent)(Avatar_default, {
								avatar: {
									initials: n.actor.initials,
									color: n.actor.color
								},
								size: 40
							}, null, _parent, _scopeId));
							_push(`<div class="min-w-0 flex-1"${_scopeId}><div class="text-sm leading-snug text-ink"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)(label(n))}</div>`);
							if (n.excerpt) _push(`<div class="mt-1 truncate text-sm text-ink-muted"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)(n.excerpt)}</div>`);
							else _push(`<!---->`);
							_push(`<div class="mt-1 text-xs text-ink-muted"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)(n.time)}</div></div>`);
							if (!n.read) _push(`<span class="mt-1.5 h-2.5 w-2.5 shrink-0 rounded-full bg-primary"${_scopeId}></span>`);
							else _push(`<!---->`);
							_push(`<button type="button"${(0, server_renderer_exports.ssrRenderAttr)("title", (0, vue_exports.unref)(t)("Dismiss"))} class="-mr-1 shrink-0 rounded-md p-1 text-ink-muted opacity-0 transition hover:bg-red-500/10 hover:text-red-500 focus:opacity-100 group-hover:opacity-100"${_scopeId}><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"${_scopeId}><path d="M18 6 6 18M6 6l12 12"${_scopeId}></path></svg></button></div>`);
						});
						_push(`<!--]-->`);
						if (!props.items.length) _push(`<div class="px-5 py-16 text-center text-ink-muted"${_scopeId}><div class="text-3xl"${_scopeId}>🎉</div><p class="mt-2 text-sm"${_scopeId}>${(0, server_renderer_exports.ssrInterpolate)((0, vue_exports.unref)(t)("No notifications yet — you're all caught up."))}</p></div>`);
						else _push(`<!---->`);
						_push(`</div></div>`);
					} else return [(0, vue_exports.createVNode)("div", { class: "mx-auto max-w-[760px]" }, [(0, vue_exports.createVNode)("div", { class: "mb-5 flex items-center justify-between" }, [(0, vue_exports.createVNode)("h1", { class: "text-2xl font-extrabold tracking-tight" }, (0, vue_exports.toDisplayString)((0, vue_exports.unref)(t)("Notifications")), 1), (0, vue_exports.createVNode)("div", { class: "flex items-center gap-2" }, [props.unread > 0 ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("button", {
						key: 0,
						type: "button",
						class: "rounded-lg border border-line bg-surface px-3 py-2 text-sm font-semibold text-ink-2 hover:bg-surface-2",
						onClick: markAll
					}, (0, vue_exports.toDisplayString)((0, vue_exports.unref)(t)("Mark all read")), 1)) : (0, vue_exports.createCommentVNode)("", true), props.items.length ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("button", {
						key: 1,
						type: "button",
						class: "rounded-lg border border-line bg-surface px-3 py-2 text-sm font-semibold text-ink-2 hover:border-red-500/40 hover:text-red-500",
						onClick: clearAll
					}, (0, vue_exports.toDisplayString)((0, vue_exports.unref)(t)("Clear all")), 1)) : (0, vue_exports.createCommentVNode)("", true)])]), (0, vue_exports.createVNode)("div", { class: "overflow-hidden rounded-c border border-line bg-surface" }, [((0, vue_exports.openBlock)(true), (0, vue_exports.createBlock)(vue_exports.Fragment, null, (0, vue_exports.renderList)(props.items, (n) => {
						return (0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("div", {
							key: n.id,
							class: ["group flex w-full cursor-pointer items-start gap-3 border-b border-line/60 px-5 py-4 text-left last:border-0 hover:bg-surface-2", !n.read ? "bg-primary/10" : ""],
							onClick: ($event) => go(n)
						}, [
							!n.actor ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("div", {
								key: 0,
								class: "grid h-10 w-10 shrink-0 place-items-center rounded-full bg-primary/15 text-xl"
							}, "🎉")) : ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)(Avatar_default, {
								key: 1,
								avatar: {
									initials: n.actor.initials,
									color: n.actor.color
								},
								size: 40
							}, null, 8, ["avatar"])),
							(0, vue_exports.createVNode)("div", { class: "min-w-0 flex-1" }, [
								(0, vue_exports.createVNode)("div", { class: "text-sm leading-snug text-ink" }, (0, vue_exports.toDisplayString)(label(n)), 1),
								n.excerpt ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("div", {
									key: 0,
									class: "mt-1 truncate text-sm text-ink-muted"
								}, (0, vue_exports.toDisplayString)(n.excerpt), 1)) : (0, vue_exports.createCommentVNode)("", true),
								(0, vue_exports.createVNode)("div", { class: "mt-1 text-xs text-ink-muted" }, (0, vue_exports.toDisplayString)(n.time), 1)
							]),
							!n.read ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("span", {
								key: 2,
								class: "mt-1.5 h-2.5 w-2.5 shrink-0 rounded-full bg-primary"
							})) : (0, vue_exports.createCommentVNode)("", true),
							(0, vue_exports.createVNode)("button", {
								type: "button",
								title: (0, vue_exports.unref)(t)("Dismiss"),
								class: "-mr-1 shrink-0 rounded-md p-1 text-ink-muted opacity-0 transition hover:bg-red-500/10 hover:text-red-500 focus:opacity-100 group-hover:opacity-100",
								onClick: (0, vue_exports.withModifiers)(($event) => clearOne(n), ["stop"])
							}, [((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("svg", {
								width: "16",
								height: "16",
								viewBox: "0 0 24 24",
								fill: "none",
								stroke: "currentColor",
								"stroke-width": "2",
								"stroke-linecap": "round"
							}, [(0, vue_exports.createVNode)("path", { d: "M18 6 6 18M6 6l12 12" })]))], 8, ["title", "onClick"])
						], 10, ["onClick"]);
					}), 128)), !props.items.length ? ((0, vue_exports.openBlock)(), (0, vue_exports.createBlock)("div", {
						key: 0,
						class: "px-5 py-16 text-center text-ink-muted"
					}, [(0, vue_exports.createVNode)("div", { class: "text-3xl" }, "🎉"), (0, vue_exports.createVNode)("p", { class: "mt-2 text-sm" }, (0, vue_exports.toDisplayString)((0, vue_exports.unref)(t)("No notifications yet — you're all caught up.")), 1)])) : (0, vue_exports.createCommentVNode)("", true)])])];
				}),
				_: 1
			}, _parent));
			_push(`<!--]-->`);
		};
	}
});
//#endregion
//#region resources/js/Pages/Notifications/Index.vue
var _sfc_setup = Index_vue_vue_type_script_setup_true_lang_default.setup;
Index_vue_vue_type_script_setup_true_lang_default.setup = (props, ctx) => {
	const ssrContext = (0, vue_exports.useSSRContext)();
	(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("resources/js/Pages/Notifications/Index.vue");
	return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
var Index_default = Index_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { Index_default as default };
