From a54d978011436975c151fbd6c729a840ce191dcc Mon Sep 17 00:00:00 2001 From: Sebastiaan Zeeff <33516116+SebastiaanZ@users.noreply.github.com> Date: Thu, 31 Oct 2019 21:46:17 +0100 Subject: Make newlines visible in deleted messages MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit https://github.com/python-discord/site/issues/302 This commit makes newlines in deleted messages visible in the deleted messages front-end and makes sure they are not stripped during the conversion to HTML. To represent newlines, I've chosen a commonly used symbol: `↵`. In addition, I've kaizened the colour filter that translates integer representations of colours to their RGB hex-value. The Discord dark theme shows black colours (int: 0; hex: #000000) as white instead, to make reading them against the dark background easier. This commit makes sure our front-end displays the same behavior. This closes #302 --- .../staff/templatetags/deletedmessage_filters.py | 15 +++++++- .../staff/tests/test_deletedmessage_filters.py | 43 +++++++++++++++++++--- pydis_site/static/css/staff/logs.css | 1 - pydis_site/templates/staff/logs.html | 4 +- 4 files changed, 53 insertions(+), 10 deletions(-) diff --git a/pydis_site/apps/staff/templatetags/deletedmessage_filters.py b/pydis_site/apps/staff/templatetags/deletedmessage_filters.py index f950870f..8e14ced6 100644 --- a/pydis_site/apps/staff/templatetags/deletedmessage_filters.py +++ b/pydis_site/apps/staff/templatetags/deletedmessage_filters.py @@ -7,11 +7,22 @@ register = template.Library() @register.filter def hex_colour(color: int) -> str: - """Converts an integer representation of a colour to the RGB hex value.""" - return f"#{color:0>6X}" + """ + Converts an integer representation of a colour to the RGB hex value. + + As we are using a Discord dark theme analogue, black colours are returned as white instead. + """ + colour = f"#{color:0>6X}" + return colour if colour != "#000000" else "#FFFFFF" @register.filter def footer_datetime(timestamp: str) -> datetime: """Takes an embed timestamp and returns a timezone-aware datetime object.""" return datetime.fromisoformat(timestamp) + + +@register.filter +def visible_newlines(text: str) -> str: + """Takes an embed timestamp and returns a timezone-aware datetime object.""" + return text.replace("\n", " ↵
") diff --git a/pydis_site/apps/staff/tests/test_deletedmessage_filters.py b/pydis_site/apps/staff/tests/test_deletedmessage_filters.py index d9179044..31215784 100644 --- a/pydis_site/apps/staff/tests/test_deletedmessage_filters.py +++ b/pydis_site/apps/staff/tests/test_deletedmessage_filters.py @@ -18,16 +18,49 @@ class Colour(enum.IntEnum): class DeletedMessageFilterTests(TestCase): def test_hex_colour_filter(self): - self.assertEqual(deletedmessage_filters.hex_colour(Colour.BLACK), "#000000") - self.assertEqual(deletedmessage_filters.hex_colour(Colour.BLUE), "#0000FF") - self.assertEqual(deletedmessage_filters.hex_colour(Colour.GREEN), "#00FF00") - self.assertEqual(deletedmessage_filters.hex_colour(Colour.RED), "#FF0000") - self.assertEqual(deletedmessage_filters.hex_colour(Colour.WHITE), "#FFFFFF") + """The filter should produce the correct hex values from the integer representations.""" + test_values = ( + (Colour.BLUE, "#0000FF"), + (Colour.GREEN, "#00FF00"), + (Colour.RED, "#FF0000"), + (Colour.WHITE, "#FFFFFF"), + + # Since we're using a "Discord dark theme"-like front-end, show black text as white. + (Colour.BLACK, "#FFFFFF"), + ) + + for colour, hex_value in test_values: + with self.subTest(colour=colour, hex_value=hex_value): + self.assertEqual(deletedmessage_filters.hex_colour(colour), hex_value) def test_footer_datetime_filter(self): + """The filter should parse the ISO-datetime string and return a timezone-aware datetime.""" datetime_aware = timezone.now() iso_string = datetime_aware.isoformat() datetime_returned = deletedmessage_filters.footer_datetime(iso_string) self.assertTrue(timezone.is_aware(datetime_returned)) self.assertEqual(datetime_aware, datetime_returned) + + def test_visual_newlines_filter(self): + """The filter should replace newline characters by newline character and html linebreak.""" + html_br = " ↵
" + + test_values = ( + ( + "Hello, this line does not contain a linebreak", + "Hello, this line does not contain a linebreak" + ), + ( + "A single linebreak\nin a string", + f"A single linebreak{html_br}in a string" + ), + ( + "Consecutive linebreaks\n\n\nwork, too", + f"Consecutive linebreaks{html_br}{html_br}{html_br}work, too" + ) + ) + + for input_, expected_output in test_values: + with self.subTest(input=input_, expected_output=expected_output): + self.assertEqual(deletedmessage_filters.visible_newlines(input_), expected_output) diff --git a/pydis_site/static/css/staff/logs.css b/pydis_site/static/css/staff/logs.css index d7bb04cf..acf4f1f7 100644 --- a/pydis_site/static/css/staff/logs.css +++ b/pydis_site/static/css/staff/logs.css @@ -39,7 +39,6 @@ main.site-content { } .discord-message-metadata { - color: hsla(0, 0%, 100%, .2); font-size: 0.75rem; font-weight: 400; margin: 0 .3rem; diff --git a/pydis_site/templates/staff/logs.html b/pydis_site/templates/staff/logs.html index 9c8ed7d3..907c3327 100644 --- a/pydis_site/templates/staff/logs.html +++ b/pydis_site/templates/staff/logs.html @@ -19,10 +19,10 @@
{{ message.author }}{{ message.timestamp }} | User ID: {{ message.author.id }} + class="discord-message-metadata has-text-grey">{{ message.timestamp }} | User ID: {{ message.author.id }}
- {{ message.content|linebreaks }} + {{ message.content | escape | visible_newlines | safe }}
{% for embed in message.embeds %}
-- cgit v1.2.3