Files
notifications-admin/app/templates/views/organizations/organization/index.html
Alex Janousek 6f5750f095 Removed all govuk css (#2814)
* Removed all govuk css

* Updated reference files

* Removing govuk js

* Fixed casing for modules, removed unused page

* Got more reference images

* Updated template page

* Removed govuk padding util

* Updated hint to uswds hint

* More govuk cleanup

* Commiting backstopjs ref files

* Fixed all unit tests that broke due to brittleness around govuk styling

* Added new ref images

* Final removal of govuk

* Officially removed all govuk references

* Updated reference file

* Updated link to button

* UI modernization

* Cleanup

* removed govuk escaping tests since they are no longer needed

* Fix CodeQL security issue in escapeElementName function

- Escape backslashes first before other special characters
- Prevents potential double-escaping vulnerability
- Addresses CodeQL alert about improper string escaping

* Found more govuk removal. Fixed unit tests

* Add missing pipeline check to pre-commit

* updated test

* Updated e2e test

* More update to e2e test

* Fixed another e2e test

* Simple PR comments addressed

* More updates

* Updated backstop ref files

* Refactored folder selection for non-admins

* Updated redundant line

* Updated tests to include correct mocks

* Added more ref files

* Addressing carlos comments

* Addressing Carlo comments, cleanup of window initing

* More cleanup and addressing carlo comments

* Fixing a11 scan

* Fixed a few issues with javascript

* Fixed for pr

* Fixing e2e tests

* Tweaking e2e test

* Added more ref files and cleaned up urls.js

* Fixed bug with creating new template

* Removed brittle test - addressed code ql comment

* e2e race condition fix

* More e2e test fixes

* Updated e2e tests to not wait for text sent

* Updated test to not wait for button click response

* Made tear down more resilent if staging is down

* reverted e2e test to what was working before main merge

* Updated backstopRef images

* Updated gulp to include job-polling differently
2025-10-06 09:38:54 -04:00

103 lines
2.9 KiB
HTML

{% from "components/page-header.html" import page_header %}
{% from "components/big-number.html" import big_number %}
{% from "components/live-search.html" import live_search %}
{% from "components/pill.html" import pill %}
{% extends "withnav_template.html" %}
{% block org_page_title %}
Usage
{% endblock %}
{% block maincolumn_content %}
{{ page_header('Usage', size='medium') }}
<div class="margin-bottom-3">
{{ pill(years, selected_year, big_number_args={'smallest': True}) }}
</div>
<div class="grid-row margin-bottom-3">
<div class="grid-col-6">
<h2 class="font-heading-md">Emails</h2>
<div class="keyline-block">
{{ big_number(
total_emails_sent,
label='sent',
smaller=True
) }}
</div>
</div>
<div class="grid-col-6">
<h2 class="font-heading-md">Text messages</h2>
<div class="keyline-block">
{{ big_number(
total_sms_cost,
'spent',
currency="$",
smaller=True
) }}
</div>
</div>
</div>
{% if search_form %}
<div>
{{ live_search(
target_selector='.organization-service',
show=True,
form=search_form,
label='Search by service'
) }}
</div>
{% endif %}
<h2 class="font-heading-md {% if search_form %}visually-hidden{% endif %}">By service</h2>
{% for service in services %}
<div class="keyline-block organization-service">
<h3 class="live-search-relevant">
<a href="{{ url_for('main.usage', service_id=service.service_id) }}" class="usa-link browse-list-link">{{ service.service_name }}</a>
</h3>
<div class="grid-row">
<div class="grid-col-6">
{{ big_number(
service.emails_sent,
label=service.emails_sent|message_count_label('email'),
smallest=True
) }}
</div>
<div class="grid-col-6">
{% if service.sms_cost %}
{{ big_number(
service.sms_cost,
'spent on text messages',
currency="$",
smallest=True
) }}
{% else %}
{{ big_number(
service.sms_billable_units,
'free {}'.format(service.sms_billable_units|message_count_label('sms')),
smallest=True
) }}
{% endif %}
</div>
</div>
</div>
{% endfor %}
<div class="keyline-block"></div>
{% if not services %}
<p class="usa-body usa-hint">
{{ current_org.name }} has no live services on Notify.gov
</p>
<div class="keyline-block"></div>
{% else %}
<div class="js-stick-at-bottom-when-scrolling">
<p>
<a href="{{ download_link }}" download="download" class="usa-link">Download this report (<abbr title="Comma separated values">CSV</abbr>)</a>
</p>
</div>
{% endif %}
{% endblock %}