From b60d9f6644eee37c3e542846669f7064322bd5bf Mon Sep 17 00:00:00 2001 From: Adam Goldsmith Date: Tue, 23 Jul 2024 00:01:29 -0400 Subject: [PATCH] Add/apply `prettier` --- .gitea/workflows/ruff.yml | 2 +- .gitea/workflows/test.yml | 11 +- .prettierignore | 6 + .prettierrc | 0 dashboard/js/dashboard.ts | 5 +- js/base.ts | 6 +- .../membershipworks/css/event_invoice_pdf.css | 10 +- .../css/event_invoice_pdf_preview.css | 7 +- package.json | 1 + paperwork/js/department_certifications.ts | 36 +++-- .../certification-form-clear-autocomplete.js | 19 ++- .../static/paperwork/certification-print.css | 146 +++++++++--------- pnpm-lock.yaml | 10 ++ renovate.json | 4 +- static/bootstrap-color-toggle.js | 34 ++-- vite.config.js | 2 +- 16 files changed, 173 insertions(+), 126 deletions(-) create mode 100644 .prettierignore create mode 100644 .prettierrc diff --git a/.gitea/workflows/ruff.yml b/.gitea/workflows/ruff.yml index 4051655..17d2b33 100644 --- a/.gitea/workflows/ruff.yml +++ b/.gitea/workflows/ruff.yml @@ -1,5 +1,5 @@ name: Ruff -on: [ push, pull_request ] +on: [push, pull_request] jobs: ruff: runs-on: ubuntu-latest diff --git a/.gitea/workflows/test.yml b/.gitea/workflows/test.yml index 0bd7241..24dba43 100644 --- a/.gitea/workflows/test.yml +++ b/.gitea/workflows/test.yml @@ -1,5 +1,5 @@ name: Test -on: [ push, pull_request ] +on: [push, pull_request] env: DJANGO_CONFIGURATION: CI @@ -14,7 +14,14 @@ jobs: env: MARIADB_ROOT_PASSWORD: whatever healthcheck: - test: ["CMD", "healthcheck.sh", "--su-mysql", "--connect", "--innodb_initialized"] + test: + [ + "CMD", + "healthcheck.sh", + "--su-mysql", + "--connect", + "--innodb_initialized", + ] steps: - uses: actions/checkout@v4 - name: Setup PDM diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..8fe480e --- /dev/null +++ b/.prettierignore @@ -0,0 +1,6 @@ +*.dj.html + +pnpm-lock.yaml +.mypy_cache/ +.venv/ +.pytest_cache/ diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..e69de29 diff --git a/dashboard/js/dashboard.ts b/dashboard/js/dashboard.ts index 0e631c6..7361cb7 100644 --- a/dashboard/js/dashboard.ts +++ b/dashboard/js/dashboard.ts @@ -1,7 +1,8 @@ import { Tooltip } from "bootstrap"; + const tooltipTriggerList = document.querySelectorAll( '[data-bs-toggle="tooltip"]', ); -for (let tooltipTriggerEl of tooltipTriggerList) { - new Tooltip(tooltipTriggerEl); +for (const tooltipTriggerElement of tooltipTriggerList) { + new Tooltip(tooltipTriggerElement); } diff --git a/js/base.ts b/js/base.ts index 74b10b9..f3e936f 100644 --- a/js/base.ts +++ b/js/base.ts @@ -1,3 +1,3 @@ -import 'bootstrap/scss/bootstrap.scss'; -import 'bootstrap-icons/font/bootstrap-icons.css'; -import 'bootstrap'; +import "bootstrap/scss/bootstrap.scss"; +import "bootstrap-icons/font/bootstrap-icons.css"; +import "bootstrap"; diff --git a/membershipworks/static/membershipworks/css/event_invoice_pdf.css b/membershipworks/static/membershipworks/css/event_invoice_pdf.css index 206808c..ed0ffb1 100644 --- a/membershipworks/static/membershipworks/css/event_invoice_pdf.css +++ b/membershipworks/static/membershipworks/css/event_invoice_pdf.css @@ -70,13 +70,13 @@ p { } .d-md-block { - display: block !important; + display: block !important; } .col-md-7 { - flex: 0 0 auto; - width: 58.33333333%; + flex: 0 0 auto; + width: 58.33333333%; } .col-md-4 { - flex: 0 0 auto; - width: 33.33333333%; + flex: 0 0 auto; + width: 33.33333333%; } diff --git a/membershipworks/static/membershipworks/css/event_invoice_pdf_preview.css b/membershipworks/static/membershipworks/css/event_invoice_pdf_preview.css index 8fcfd01..21b74ec 100644 --- a/membershipworks/static/membershipworks/css/event_invoice_pdf_preview.css +++ b/membershipworks/static/membershipworks/css/event_invoice_pdf_preview.css @@ -1,7 +1,8 @@ @page { - background-image:url("data:image/svg+xml;utf8,PREVIEW"); + background-image: url("data:image/svg+xml;utf8,PREVIEW"); } -body, table * { - background: transparent !important; +body, +table * { + background: transparent !important; } diff --git a/package.json b/package.json index 5afedf5..1746534 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "devDependencies": { "@types/bootstrap": "^5.2.10", "@types/tabulator-tables": "^6.2.3", + "prettier": "^3.3.3", "sass": "^1.77.8", "typescript": "^5.5.4", "vite": "^5.3.4" diff --git a/paperwork/js/department_certifications.ts b/paperwork/js/department_certifications.ts index 36c464d..8ae4c78 100644 --- a/paperwork/js/department_certifications.ts +++ b/paperwork/js/department_certifications.ts @@ -4,7 +4,7 @@ import { FilterModule, HtmlTableImportModule, ResponsiveLayoutModule, - FilterType, + type FilterType, } from "tabulator-tables"; import "tabulator-tables/src/scss/themes/bootstrap/tabulator_bootstrap5.scss"; @@ -16,14 +16,16 @@ Tabulator.registerModule([ ]); Tabulator.extendModule("filter", "filters", { - "!includes": function(headerValue: string, rowValue: string){ + "!includes"(headerValue: string, rowValue: string) { return !rowValue.includes(headerValue); - } + }, }); -const certification_table_el = document.querySelector("table.certifications"); -if (certification_table_el instanceof HTMLTableElement) { - const certification_table = new Tabulator(certification_table_el, { +const certification_table_element = document.querySelector( + "table.certifications", +); +if (certification_table_element instanceof HTMLTableElement) { + const certification_table = new Tabulator(certification_table_element, { layout: "fitDataFill", responsiveLayout: "collapse", pagination: true, @@ -31,7 +33,7 @@ if (certification_table_el instanceof HTMLTableElement) { columnDefaults: { headerFilter: true, }, - rowFormatter: function (row) { + rowFormatter(row) { const data = row.getData(); if (data.version.includes("[OUTDATED]")) { row.getElement().classList.add("table-warning"); @@ -80,19 +82,27 @@ if (certification_table_el instanceof HTMLTableElement) { function setOutdatedFilter(showOutdated: boolean) { if (showOutdated) { - certification_table.removeFilter("version", "!includes" as FilterType, "[OUTDATED]"); + certification_table.removeFilter( + "version", + "!includes" as FilterType, + "[OUTDATED]", + ); } else { - certification_table.addFilter("version", "!includes" as FilterType, "[OUTDATED]"); + certification_table.addFilter( + "version", + "!includes" as FilterType, + "[OUTDATED]", + ); } } certification_table.on("tableBuilt", () => { - const outdatedToggle = document.getElementById("showOutdated"); + const outdatedToggle = document.querySelector("#showOutdated"); if (outdatedToggle instanceof HTMLInputElement) { setOutdatedFilter(outdatedToggle.checked); - outdatedToggle.addEventListener("change", () => - setOutdatedFilter(outdatedToggle.checked), - ); + outdatedToggle.addEventListener("change", () => { + setOutdatedFilter(outdatedToggle.checked); + }); } }); } diff --git a/paperwork/static/paperwork/certification-form-clear-autocomplete.js b/paperwork/static/paperwork/certification-form-clear-autocomplete.js index 2bd2f34..90206ee 100644 --- a/paperwork/static/paperwork/certification-form-clear-autocomplete.js +++ b/paperwork/static/paperwork/certification-form-clear-autocomplete.js @@ -1,10 +1,15 @@ -window.addEventListener('load', function() { - // Bind on certification_definition field change - django.jQuery(':input[name$=certification_definition]').on('change', function() { - // Get the field prefix, ie. if this comes from a formset form - var prefix = django.jQuery(this).getFormPrefix(); +window.addEventListener("load", function () { + // Bind on certification_definition field change + django + .jQuery(":input[name$=certification_definition]") + .on("change", function () { + // Get the field prefix, ie. if this comes from a formset form + const prefix = django.jQuery(this).getFormPrefix(); - // Clear the autocomplete with the same prefix - django.jQuery(':input[name=' + prefix + 'certification_version]').val(null).trigger('change'); + // Clear the autocomplete with the same prefix + django + .jQuery(":input[name=" + prefix + "certification_version]") + .val(null) + .trigger("change"); }); }); diff --git a/paperwork/static/paperwork/certification-print.css b/paperwork/static/paperwork/certification-print.css index 601c25f..45e39e9 100644 --- a/paperwork/static/paperwork/certification-print.css +++ b/paperwork/static/paperwork/certification-print.css @@ -1,88 +1,94 @@ #cert-data { - string-set: certname attr(data-name), - certversion attr(data-version), - certapprovaldate attr(data-approvaldate); - /* Can't be `display: none;`, as it breaks string-set */ - visibility: hidden; - position: absolute; - bottom: 0px; + string-set: + certname attr(data-name), + certversion attr(data-version), + certapprovaldate attr(data-approvaldate); + /* Can't be `display: none;`, as it breaks string-set */ + visibility: hidden; + position: absolute; + bottom: 0px; } .checklist li::marker { - content: "□\00A0"; - padding-right: 1em; + content: "□\00A0"; + padding-right: 1em; } .no-break { - break-inside: avoid; + break-inside: avoid; } @media print { - body, p, li { - font-size: 10pt !important; - line-height: 1.2 !important; + body, + p, + li { + font-size: 10pt !important; + line-height: 1.2 !important; + } + + .no-print, + .print-warning, + .toc, + body > :not(.mw-page-container), + #content > :not(#bodyContent), + #bodyContent > :not(#mw-content-text), + #mw-content-text > :not(.mw-parser-output) { + display: none !important; + } + + h1, + h2, + h3, + h4 { + padding-top: 0em !important; + margin-top: 0em !important; + break-before: auto !important; + } + + .qrlite-result img { + width: 1.5in; + } + + /* Turn off mediawiki's added text for mailto links */ + a[href^="mailto:"]::after { + content: none !important; + } + + /* Add link target as text, except mailto links */ + a:not([href^="mailto:"])::after { + content: " [" attr(href) "]"; + color: initial; + text-decoration: none; + } + + @page { + size: letter portrait; + margin: 1in; + + @top-left { + content: string(certname); + font-size: 1.2em; + color: #444; + vertical-align: bottom; + padding-bottom: 0.2em; } - .no-print, - .print-warning, - .toc, - body > :not(.mw-page-container), - #content > :not(#bodyContent), - #bodyContent > :not(#mw-content-text), - #mw-content-text > :not(.mw-parser-output) { - display: none !important; + @top-right { + content: ""; + background-image: url("https://claremontmakerspace.org/wp-content/uploads/2018/06/cms_logo.png"); + background-repeat: no-repeat; + background-position: bottom; + background-size: 100%; + width: 7em; } - h1, h2, h3, h4 { - padding-top: 0em !important; - margin-top: 0em !important; - break-before: auto !important; + @bottom-left { + content: string(certversion) " - " string(certapprovaldate); + color: #444; } - .qrlite-result img { - width: 1.5in; - } - - /* Turn off mediawiki's added text for mailto links */ - a[href^="mailto:"]::after { - content: none !important; - } - - /* Add link target as text, except mailto links */ - a:not([href^="mailto:"])::after { - content: " [" attr(href) "]"; - color: initial; - text-decoration: none; - } - - @page { - size: letter portrait; - margin: 1in; - - @top-left { - content: string(certname); - font-size: 1.2em; - color: #444; - vertical-align: bottom; - padding-bottom: 0.2em; - } - - @top-right { - content: ''; - background-image: url("https://claremontmakerspace.org/wp-content/uploads/2018/06/cms_logo.png"); - background-repeat: no-repeat; - background-position: bottom; - background-size: 100%; - width: 7em; - } - - @bottom-left { - content: string(certversion) " - " string(certapprovaldate); - color: #444; - } - - @bottom-right-corner { - content: counter(page); - } + @bottom-right-corner { + content: counter(page); } + } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 45ff91c..cd0dbf0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -27,6 +27,9 @@ importers: '@types/tabulator-tables': specifier: ^6.2.3 version: 6.2.3 + prettier: + specifier: ^3.3.3 + version: 3.3.3 sass: specifier: ^1.77.8 version: 1.77.8 @@ -350,6 +353,11 @@ packages: resolution: {integrity: sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==} engines: {node: ^10 || ^12 || >=14} + prettier@3.3.3: + resolution: {integrity: sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==} + engines: {node: '>=14'} + hasBin: true + readdirp@3.6.0: resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} engines: {node: '>=8.10.0'} @@ -631,6 +639,8 @@ snapshots: picocolors: 1.0.1 source-map-js: 1.2.0 + prettier@3.3.3: {} + readdirp@3.6.0: dependencies: picomatch: 2.3.1 diff --git a/renovate.json b/renovate.json index 5db72dd..22a9943 100644 --- a/renovate.json +++ b/renovate.json @@ -1,6 +1,4 @@ { "$schema": "https://docs.renovatebot.com/renovate-schema.json", - "extends": [ - "config:recommended" - ] + "extends": ["config:recommended"] } diff --git a/static/bootstrap-color-toggle.js b/static/bootstrap-color-toggle.js index a0a20c8..13a8a43 100644 --- a/static/bootstrap-color-toggle.js +++ b/static/bootstrap-color-toggle.js @@ -27,9 +27,9 @@ theme === "auto" && window.matchMedia("(prefers-color-scheme: dark)").matches ) { - document.documentElement.setAttribute("data-bs-theme", "dark"); + document.documentElement.dataset.bsTheme = "dark"; } else { - document.documentElement.setAttribute("data-bs-theme", theme); + document.documentElement.dataset.bsTheme = theme; } }; @@ -44,25 +44,27 @@ const themeSwitcherText = document.querySelector("#bd-theme-text"); const activeThemeIcon = document.querySelector(".theme-icon-active"); - const btnToActive = document.querySelector( + const buttonToActive = document.querySelector( `[data-bs-theme-value="${theme}"]`, ); const activeIcon = [ - ...btnToActive.querySelector(".theme-icon").classList, + ...buttonToActive.querySelector(".theme-icon").classList, ].find((c) => c.startsWith("bi-")); - document.querySelectorAll("[data-bs-theme-value]").forEach((element) => { + for (const element of document.querySelectorAll("[data-bs-theme-value]")) { element.classList.remove("active"); element.setAttribute("aria-pressed", "false"); - }); + } - btnToActive.classList.add("active"); - btnToActive.setAttribute("aria-pressed", "true"); - [...activeThemeIcon.classList] - .filter((c) => c.startsWith("bi-")) - .forEach((icon) => activeThemeIcon.classList.remove(icon)); + buttonToActive.classList.add("active"); + buttonToActive.setAttribute("aria-pressed", "true"); + for (const icon of activeThemeIcon.classList) { + if (icon.startsWith("bi-")) { + activeThemeIcon.classList.remove(icon); + } + } activeThemeIcon.classList.add(activeIcon); - const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`; + const themeSwitcherLabel = `${themeSwitcherText.textContent} (${buttonToActive.dataset.bsThemeValue})`; themeSwitcher.setAttribute("aria-label", themeSwitcherLabel); if (focus) { @@ -80,16 +82,16 @@ }); window.addEventListener("DOMContentLoaded", () => { - console.log(getPreferredTheme()); + console.log(getPreferredTheme()); showActiveTheme(getPreferredTheme()); - document.querySelectorAll("[data-bs-theme-value]").forEach((toggle) => { + for (const toggle of document.querySelectorAll("[data-bs-theme-value]")) { toggle.addEventListener("click", () => { - const theme = toggle.getAttribute("data-bs-theme-value"); + const theme = toggle.dataset.bsThemeValue; setStoredTheme(theme); setTheme(theme); showActiveTheme(theme, true); }); - }); + } }); })(); diff --git a/vite.config.js b/vite.config.js index 6c7c02a..2dd0e91 100644 --- a/vite.config.js +++ b/vite.config.js @@ -1,5 +1,5 @@ +import { resolve, join } from "node:path"; import { defineConfig } from "vite"; -import { resolve, join } from "path"; export default defineConfig({ base: "/static/",