Signal/Desktop
1
0
Fork 0
mirror of https://github.com/signalapp/Signal-Desktop.git synced 2026-02-15 07:28:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix donation receipts list noMouseClose

Browse Source 
Co-authored-by: ayumi-signal <143036029+ayumi-signal@users.noreply.github.com>
This commit is contained in:
automated-signal
2025-08-20 12:23:42 -05:00
committed by GitHub
parent 088f42f477
commit e0dba938ea
3 changed files with 52 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
_locales/en/messages.json
View File

@@ -8878,6 +8878,10 @@
"messageformat": "Receipts",
"description": "Menu item to view donation receipts"
},
"icu:PreferencesDonations__receipt-details-button-aria": {
"messageformat": "View receipt details",
"description": "Donation receipts list accessibility label for a single receipt."
},
"icu:PreferencesDonations__faqs": {
"messageformat": "Donation FAQs",
"description": "Menu item to view donation FAQs"

9
stylesheets/components/PreferencesDonations.scss
View File

@@ -244,6 +244,15 @@
);
}
@include mixins.keyboard-mode {
&:focus {
background-color: light-dark(
variables.$color-gray-02,
variables.$color-gray-80
);
}
}
// Currently only one time donations are possible
&__icon {
@include mixins.light-theme {

74
ts/components/PreferencesDonations.tsx
View File

@@ -354,33 +354,20 @@ function PreferencesReceiptList({
useState<DonationReceipt | null>(null);
const [isDownloading, setIsDownloading] = useState(false);
const sortedReceipts = sortBy(
donationReceipts,
receipt => -receipt.timestamp
);
const receiptsByYear = groupBy(sortedReceipts, receipt =>
new Date(receipt.timestamp).getFullYear()
const hasReceipts = useMemo(
() => donationReceipts.length > 0,
[donationReceipts]
);
const dateFormatter = getDateTimeFormatter({
month: 'short',
day: 'numeric',
year: 'numeric',
});
const preferredSystemLocales =
window.SignalContext.getPreferredSystemLocales();
const localeOverride = window.SignalContext.getLocaleOverride();
const locales =
localeOverride != null ? [localeOverride] : preferredSystemLocales;
const getCurrencyFormatter = (currencyType: string) =>
new Intl.NumberFormat(locales, {
style: 'currency',
currency: currencyType,
});
const hasReceipts = Object.keys(receiptsByYear).length > 0;
const receiptsByYear = useMemo(() => {
const sortedReceipts = sortBy(
donationReceipts,
receipt => -receipt.timestamp
);
return groupBy(sortedReceipts, receipt =>
new Date(receipt.timestamp).getFullYear()
);
}, [donationReceipts]);
const handleDownloadReceipt = useCallback(async () => {
if (!selectedReceipt) {
@@ -420,6 +407,24 @@ function PreferencesReceiptList({
showToast,
]);
const dateFormatter = getDateTimeFormatter({
month: 'short',
day: 'numeric',
year: 'numeric',
});
const preferredSystemLocales =
window.SignalContext.getPreferredSystemLocales();
const localeOverride = window.SignalContext.getLocaleOverride();
const locales =
localeOverride != null ? [localeOverride] : preferredSystemLocales;
const getCurrencyFormatter = (currencyType: string) =>
new Intl.NumberFormat(locales, {
style: 'currency',
currency: currencyType,
});
return (
<div className="PreferencesDonations PreferencesDonations--receiptList">
{hasReceipts ? (
@@ -438,14 +443,16 @@ function PreferencesReceiptList({
<div className="PreferencesDonations--receiptList__year-header">
{year}
</div>
<ListBox className="PreferencesDonations--receiptList__list">
<div className="PreferencesDonations--receiptList__list">
{receipts.map(receipt => (
<ListBoxItem
<button
aria-label={i18n(
'icu:PreferencesDonations__receipt-details-button-aria'
)}
key={receipt.id}
className="PreferencesDonations--receiptList__receipt-item"
onAction={() => {
setSelectedReceipt(receipt);
}}
onClick={() => setSelectedReceipt(receipt)}
type="button"
>
<div className="PreferencesDonations--receiptList__receipt-item__icon" />
<div className="PreferencesDonations--receiptList__receipt-item__details">
@@ -461,9 +468,9 @@ function PreferencesReceiptList({
getHumanDonationAmount(receipt)
)}
</div>
</ListBoxItem>
</button>
))}
</ListBox>
</div>
</div>
))}
</>
@@ -483,9 +490,6 @@ function PreferencesReceiptList({
i18n={i18n}
modalName="ReceiptDetailsModal"
moduleClassName="PreferencesDonations__ReceiptModal"
// TODO(DESKTOP-9100): the noMouseClose prop is a temporary
// workaround for buttons on the modal not working.
noMouseClose
hasXButton
title={i18n('icu:PreferencesDonations__ReceiptModal--title')}
onClose={() => setSelectedReceipt(null)}