Improve layout for reports box on user profile

This commit is contained in:
snufkin
2024-08-16 22:09:16 +00:00
committed by Spine
parent 99d3eeb2bb
commit 7775ae3ecd
6 changed files with 53 additions and 52 deletions

View File

@@ -35,7 +35,7 @@ help:
.PHONY: build-css
build-css:
docker-compose exec -T web webpack --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
docker-compose exec -T web ./node_modules/.bin/webpack --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
.PHONY: check-php
check-php:

View File

@@ -76,12 +76,9 @@ function resolve(id, claimer) {
document.addEventListener('DOMContentLoaded', () => {
let reports = document.querySelectorAll(".user-report-reason");
reports.forEach((report) => {
if (report.scrollWidth > report.offsetWidth) {
report.addEventListener('click', () => {
report.classList.toggle('user-report-truncate');
});
report.title = "Click to expand";
}
reports.forEach((report) => {
report.addEventListener("click", () => {
report.classList.toggle("user-report-reason");
}, false);
});
});

View File

@@ -547,12 +547,28 @@ tr.torrent .bookmark > a::after {
.user-reports {
table-layout: fixed;
border: none;
line-height: 1.2em;
}
.user-report-truncate {
text-overflow: ellipsis;
.user-reports {
tr {
vertical-align: top;
}
th,
td {
padding: 0.7em;
}
}
.user-report-reason {
display: block;
overflow: hidden;
white-space: nowrap;
max-height: 3.6em;
}
.pre-wrap {
white-space: pre-wrap;
}
/* Wrap release info for consistent DOM and to limit table expansion. */

View File

@@ -385,7 +385,7 @@ if ($Viewer->permitted('users_mod') || $Viewer->isStaffPMReader()) {
]);
}
if ($Viewer->permitted('users_mod')) {
if ($Viewer->permitted('admin_reports')) {
$reports = (new Gazelle\Manager\Report($userMan))->findByReportedUser($User);
if ($reports) {
echo $Twig->render('admin/user-reports-list.twig', [

View File

@@ -1,43 +1,31 @@
<div class="box" id="user-reports-box">
<div class="head">
User Reports&nbsp;
{{- dom.click('#toggle-user-reports', "$('#user-reports').gtoggle(); return false;") -}}
<a href="#" id="toggle-user-reports" class="brackets">Toggle</a>
User Reports ({{ list|length }})&nbsp;
<a href="#" onclick="$('#user-reports').gtoggle(); this.innerHTML = (this.innerHTML == 'Hide' ? 'Show' : 'Hide'); return false;" class="brackets">Show</a>
</div>
<table width="100%" id="user-reports" class="user-reports">
{%- for report in list -%}
<tr>
<td width="15%" id="report-{{ report.id }}-created">
<a href='{{ report.location }}'>{{ report.created|time_diff(1) }}</a>
</td>
<td width="65%" id="report-{{ report.id }}-reason" class="user-report-reason user-report-truncate">
{%- if report.status == "Resolved" -%}
<s>
{%- endif -%}
{{-report.reason-}}
{%- if report.status == "Resolved" -%}
</s>
{%- endif -%}
</td>
<td width="10%" id="report-{{ report.id }}-status">
{%- if report.status == "New" -%}
<b>
{%- endif -%}
{{- report.status -}}
{%- if report.status == "New" -%}
</b>
{%- endif -%}
</td>
<td id="report-{{ report.id }}-staff">
{%- if report.resolver -%}
{{- report.resolver.id|user_url -}}
{%- elseif report.claimer -%}
{{- report.claimer.id|user_url -}}
{%- else -%}
unclaimed
{%- endif -%}
</td>
</tr>
{% endfor %}
<table id="user-reports" class="user-reports layout hidden">
{% for report in list %}
<tr class="row{{ cycle(['a', 'b'], loop.index0) }}">
<td width="15%">
<div id="report-{{ report.id }}-metadata">
<a href='{{ report.location }}'>{{ report.created|time_diff(1) }}</a><br>
{% if report.status == "New" %}<b>{% endif %}
{{- report.status -}}
{% if report.status == "New" -%}</b>{% endif %}
<br>
{% if report.resolver %}
{{- report.resolver.id|user_url -}}
{% elseif report.claimer %}
{{- report.claimer.id|user_url -}}
{% else %}
unclaimed
{% endif %}
</div>
</td>
<td width="85%">
<div id="report-{{ report.id }}-reason" class="user-report-reason wrap_overflow">{{ report.reason|bb_format }}</div>
</td>
</tr>
{% endfor %}
</table>
</div>

View File

@@ -85,8 +85,8 @@ class RenderUserTest extends TestCase {
'list' => $reportMan->findByReportedUser($this->userList['user'])
]);
$this->assertStringContainsString('<div class="box" id="user-reports-box">', $reports, 'user-reports-box');
$this->assertStringContainsString('-reason" class="user-report-reason user-report-truncate">', $reports, 'user-reports-reason');
$this->assertStringContainsString('-reason" class="user-report-reason wrap_overflow">', $reports, 'user-reports-reason');
$this->assertStringContainsString($this->userReports[0]->reason(), $reports, 'user-reports0-reason-text');
$this->assertStringContainsString($this->userReports[1]->reason(), $reports, 'user-reports1-reason-text');
//$this->assertStringContainsString($this->userReports[1]->reason(), $reports, 'user-reports1-reason-text');
}
}