refactor: respect disabled state

This respects the disabled state of buttons and fixes a few styling and performance tweaks to the loop.
This commit is contained in:
Solareon 2026-04-08 09:33:49 +02:00
parent 08524e94ba
commit b8896035f3
2 changed files with 26 additions and 11 deletions

View file

@ -741,7 +741,8 @@
<div class="chatlog__action-row"> <div class="chatlog__action-row">
@foreach (var button in actionRow.Buttons) @foreach (var button in actionRow.Buttons)
{ {
var styleClass = button.Style switch { var styleClass = button.Style switch
{
ButtonStyle.Primary => "chatlog__component-button--primary", ButtonStyle.Primary => "chatlog__component-button--primary",
ButtonStyle.Secondary => "chatlog__component-button--secondary", ButtonStyle.Secondary => "chatlog__component-button--secondary",
ButtonStyle.Success => "chatlog__component-button--success", ButtonStyle.Success => "chatlog__component-button--success",
@ -752,16 +753,21 @@
}; };
var isUrlButton = button.IsUrlButton; var isUrlButton = button.IsUrlButton;
var isDisabled = button.IsDisabled;
var hasEmoji = button.Emoji is not null;
var hasLabel = !string.IsNullOrWhiteSpace(button.Label);
var emojiUrl = hasEmoji ? await ResolveAssetUrlAsync(button.Emoji.ImageUrl) : null;
var cssClass = $"chatlog__component-button {styleClass}";
if (isUrlButton) if (isUrlButton && !isDisabled)
{ {
<a class="chatlog__component-button @styleClass" href="@button.Url" target="_blank" rel="noreferrer noopener"> <a class="@cssClass" href="@button.Url" target="_blank" rel="noreferrer noopener">
@if (button.Emoji is not null) @if (hasEmoji)
{ {
<img class="chatlog__emoji chatlog__emoji--small" alt="@button.Emoji.Name" src="@await ResolveAssetUrlAsync(button.Emoji.ImageUrl)" loading="lazy"> <img class="chatlog__emoji chatlog__emoji--small" alt="@button.Emoji.Name" src="@emojiUrl" loading="lazy">
} }
@if (!string.IsNullOrWhiteSpace(button.Label)) @if (hasLabel)
{ {
<span>@button.Label</span> <span>@button.Label</span>
} }
@ -769,13 +775,13 @@
} }
else else
{ {
<button class="chatlog__component-button @styleClass" type="button" disabled> <button class="@cssClass" type="button" disabled="@isDisabled" data-url="@(isUrlButton ? button.Url : null)">
@if (button.Emoji is not null) @if (hasEmoji)
{ {
<img class="chatlog__emoji chatlog__emoji--small" alt="@button.Emoji.Name" src="@await ResolveAssetUrlAsync(button.Emoji.ImageUrl)" loading="lazy"> <img class="chatlog__emoji chatlog__emoji--small" alt="@button.Emoji.Name" src="@emojiUrl" loading="lazy">
} }
@if (!string.IsNullOrWhiteSpace(button.Label)) @if (hasLabel)
{ {
<span>@button.Label</span> <span>@button.Label</span>
} }

View file

@ -461,7 +461,16 @@
box-sizing: border-box; box-sizing: border-box;
} }
a.chatlog__component-button:hover { a.chatlog__component-button {
cursor: pointer;
}
.chatlog__component-button:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.chatlog__component-button:hover:not(:disabled) {
text-decoration: none; text-decoration: none;
filter: brightness(0.95); filter: brightness(0.95);
} }