Skip to content

Formating Aliases in the instrument page #426

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
PouyaMohseni wants to merge 2 commits into
base: develop
Choose a base branch
from
Open

Formating Aliases in the instrument page #426

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9980321
fix(detail.html): format aliases and remove source for labels
PouyaMohseni Nov 15, 2025
84a995e
fix: show alias list in one line seperated by `|` when the user is no…
PouyaMohseni Dec 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
149 changes: 109 additions & 40 deletions web-app/django/VIM/templates/instruments/detail.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,12 +65,6 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
<th scope="col" class="w-20">
<span>Name</span>
</th>
<th scope="col" class="w-20">
<span>Alias</span>
</th>
<th scope="col" class="w-20">
<span>Source</span>
</th>
{% if user.is_authenticated %}
<th scope="col" class="w-25">
<span>Verification Status</span>
Expand All @@ -82,6 +76,15 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
</i>
</th>
{% endif %}
{% if user.is_authenticated %}
<th scope="col" class="w-30">
<span>Alias</span>
</th>
{% else %}
<th scope="col" class="w-20">
<span>Alias</span>
</th>
{% endif %}
{% if user.is_authenticated %}
<th scope="col">
<span class="name-form-item">Actions</span>
Expand All @@ -105,21 +108,6 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
</div>
</div>
</td>
<td class="text-start">
<div class="d-flex flex-row justify-content-between align-items-center gap-2 edit-container"
dir="{{ lang.html_direction }}">
<div class="alias-list d-flex flex-wrap gap-1">
{% for alias in names.aliases %}
<span class="alias-item notranslate">{{ alias.name }}</span>
{% endfor %}
</div>
</div>
</td>
<td>
<div class="d-flex flex-row justify-content-between align-items-center gap-2 edit-container">
<span class="view-field flex-grow-1">{{ names.label.source_name }}</span>
</div>
</td>
{% if user.is_authenticated %}
<td>
<div class="d-flex flex-row justify-content-between align-items-center gap-2 edit-container">
Expand All @@ -135,8 +123,55 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
</div>
</td>
{% endif %}
<td class="text-start">
{% if user.is_authenticated %}
{% for alias in names.aliases %}
<div class="p-1 rounded bg-light border d-flex justify-content-between align-items-center my-1">
<div class="d-flex flex-column flex-grow-1">
<span class="notranslate">{{ alias.name }}</span>
<div>
{% if alias.verification_status == 'verified' %}
<span class="badge rounded-pill bg-success">Verified</span>
{% elif alias.verification_status == 'unverified' %}
<span class="badge rounded-pill bg-secondary">Unverified</span>
{% elif alias.verification_status == 'rejected' %}
<span class="badge rounded-pill bg-danger">Rejected</span>
{% else %}
<span class="badge rounded-pill bg-warning text-dark">Under Review</span>
{% endif %}
</div>
</div>
<div class="action-buttons ms-2">
<button class="btn btn-primary btn-sm"
data-bs-toggle="modal"
data-bs-target="#deleteNameModal"
data-instrument-language="{{ alias.label.language.en_label }}"
data-instrument-name="{{ alias.label.name }}"
data-instrument-source="{{ alias.label.source_name }}"
data-instrument-id="{{ alias.label.id }}"
data-instrument-pk="{{ instrument.pk }}">
Delete
</button>
</div>
</div>
{% endfor %}
{% else %}
<div class="d-flex flex-row justify-content-between align-items-center gap-2 edit-container"
dir="{{ lang.html_direction }}">
<div class="alias-list d-flex flex-wrap gap-1">
{% for alias in names.aliases %}
<span class="alias-item notranslate">
{{ alias.name }}
{% if not forloop.last %}|{% endif %}
</span>
{% endfor %}
</div>
</div>
{% endif %}
</td>
{% if user.is_authenticated %}
<td>
<!-- TODO: Add a "More" button that links to the instrument name/alias in a popup -->
<div class="action-buttons">
<button class="btn btn-primary"
data-bs-toggle="modal"
Expand Down Expand Up @@ -176,24 +211,9 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
</div>
</div>
</div>
<!-- Aliases -->
<div class="mb-1">
<div class="fw-bold text-muted small">Alias</div>
<div class="alias-list d-flex flex-wrap gap-1 text-start notranslate"
dir="{{ lang.html_direction }}">
{% for alias in names.aliases %}
<span class="alias-item">{{ alias.name }}</span>
{% endfor %}
</div>
</div>
<!-- Source -->
<div class="mb-1">
<div class="fw-bold text-muted small">Source</div>
<span class="view-field">{{ names.label.source_name }}</span>
</div>
{% if user.is_authenticated %}
<!-- Status column -->
<div class="col-12">
<div class="col-12 mb-1">
<div class="fw-bold text-muted small mb-1">
Verification Status
<i class="bi bi-info-circle"
Expand All @@ -216,8 +236,55 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
</div>
</div>
{% endif %}
<!-- Aliases -->
<div class="mb-1">
{% if names.aliases %}
<div class="fw-bold text-muted small">Alias</div>
<div class="alias-list" dir="{{ lang.html_direction }}">
{% for alias in names.aliases %}
{% if user.is_authenticated %}
<div class="p-2 rounded bg-light border d-flex justify-content-between align-items-center my-1">
<div class="d-flex flex-column flex-grow-1">
<span class="notranslate">{{ alias.name }}</span>
<div>
{% if alias.verification_status == 'verified' %}
<span class="badge rounded-pill bg-success">Verified</span>
{% elif alias.verification_status == 'unverified' %}
<span class="badge rounded-pill bg-secondary">Unverified</span>
{% elif alias.verification_status == 'rejected' %}
<span class="badge rounded-pill bg-danger">Rejected</span>
{% else %}
<span class="badge rounded-pill bg-warning text-dark">Under Review</span>
{% endif %}
</div>
</div>
<!-- TODO: Add a "More" button that links to the instrument name/alias in a popup -->
<div class="action-buttons ms-2">
<button class="btn btn-primary btn-sm"
data-bs-toggle="modal"
data-bs-target="#deleteNameModal"
data-instrument-language="{{ alias.label.language.en_label }}"
data-instrument-name="{{ alias.label.name }}"
data-instrument-source="{{ alias.label.source_name }}"
data-instrument-id="{{ alias.label.id }}"
data-instrument-pk="{{ instrument.pk }}">
Delete
</button>
</div>
</div>
{% else %}
<span class="alias-item">{{ alias.name }}
{% if not forloop.last %}|{% endif %}
</span>
{% endif %}
{% endfor %}
</div>
{% endif %}
</div>
<!-- Action -->
{% if user.is_authenticated %}
<div class="action-buttons mt-1">
<!-- TODO: Add a "More" button that links to the instrument name/alias in a popup -->
<div class="action-buttons my-2">
<button class="btn btn-primary"
data-bs-toggle="modal"
data-bs-target="#deleteNameModal"
Expand Down Expand Up @@ -249,7 +316,8 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
{% else %}
<a href="{% url 'main:login' %}?next={{ request.path }}"
class="btn btn-primary"
role="button">Add Instrument Name</a>
role="button">Add
Instrument Name</a>
{% endif %}
</div>
</div>
Expand All @@ -268,7 +336,8 @@ <h2 class="notranslate">{{ active_instrument_label.name }}</h2>
class="rounded mw-50" />
<a class="ms-2"
href="{% static instrument.default_image.url %}"
target="_blank">View image in full size</a>
target="_blank">View image in full
size</a>
</div>
</td>
</tr>
Expand Down