Skip to content
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

Feature: Adjust modals so they dont close on click outside #53

Merged
merged 2 commits into from
Aug 21, 2024
Merged

Feature: Adjust modals so they dont close on click outside #53

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2995afb
Adjust modals so they dont close on click outside
gingemarsson Aug 3, 2024
6fe3417
Restore EquipmentListTable.tsx
gingemarsson Aug 16, 2024
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
2 changes: 1 addition & 1 deletion src/components/ChangelogCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const ChangelogCard: React.FC<Props> = ({ changelog }: Props) => {
))}
</ListGroup>
</Card>
<Modal show={showAllModal} onHide={() => setShowAllModal(false)} size="lg">
<Modal show={showAllModal} onHide={() => setShowAllModal(false)} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Ändringshistorik</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/BookingSearchCustomerModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const BookingSearchCustomerModal: React.FC<Props> = ({
};

return (
<Modal show={show} onHide={onCancel} size="lg">
<Modal show={show} onHide={onCancel} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Sök kund</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/BookingStatusButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@ const BookingStatusModal: React.FC<BookingStatusModalProps> = ({
onChange(booking);
};
return (
<Modal show={show} onHide={hide} size="lg">
<Modal show={show} onHide={hide} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Verifiera bokningsinformationen</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/equipmentLists/CopyEquipmentListEntriesModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -500,7 +500,7 @@ const CopyEquipmentListEntriesModal: React.FC<Props> = ({ show, onHide, onImport
};

return (
<Modal show={show} onHide={() => resetAndHide()} size="lg">
<Modal show={show} onHide={() => resetAndHide()} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Hämta utrustning från bokning</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/equipmentLists/EditEquipmentListDatesModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ const EditEquipmentListDatesModal: React.FC<Props> = ({ show, onHide, equipmentL
};

return (
<Modal show={show} onHide={() => onHide()} size="lg">
<Modal show={show} onHide={() => onHide()} size="lg" backdrop="static">
<Modal.Body>
<Row>
<Col lg={6}>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/equipmentLists/EditEquipmentListEntryModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ const EditEquipmentListEntryModal: React.FC<Props> = ({
}: Props) => {
const invoiceAccounts: Account[] = JSON.parse(getGlobalSetting('accounts.availableAccounts', globalSettings, '[]'));
return (
<Modal show={show} onHide={() => onHide()} size="lg">
<Modal show={show} onHide={() => onHide()} size="lg" backdrop="static">
{!!equipmentListEntryToEditViewModel ? (
<Modal.Body>
<Row>
Expand Down
3 changes: 2 additions & 1 deletion src/components/bookings/equipmentLists/EquipmentListTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -719,7 +719,8 @@ const EquipmentListTable: React.FC<Props> = ({
// Number of hours are shown if and only if there is a price per hour.
// Number of units are shown if there is no price per hour, or if there is both a price per hour and price per unit and the number of units in our inventory is larger than 1.
showNumberOfUnits={
(!!getEquipmentListEntryPrices(equipmentToAdd.prices[0], pricePlan).pricePerUnit.value &&
(!!getEquipmentListEntryPrices(equipmentToAdd.prices[0], pricePlan).pricePerUnit
.value &&
gingemarsson marked this conversation as resolved.
Show resolved Hide resolved
equipmentToAdd.inventoryCount != 1) ||
!getEquipmentListEntryPrices(equipmentToAdd.prices[0], pricePlan).pricePerHour.value
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/equipmentLists/PackageInfoModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const PackageInfoModal: React.FC<Props> = ({ show, onHide, onSave, equipmentPack
}, [onSave]);

return (
<Modal show={show} onHide={() => onHide()}>
<Modal show={show} onHide={() => onHide()} backdrop="static">
<Form>
<Modal.Header>
<Modal.Title>Lägg till utrustning från paket</Modal.Title>
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/equipmentLists/SelectNumberOfUnitsAndHoursModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ const SelectNumberOfUnitsAndHoursModal: React.FC<Props> = ({
};

return (
<Modal show={show} onHide={() => onHide()}>
<Modal show={show} onHide={() => onHide()} backdrop="static">
<Form>
<Modal.Header>
<Modal.Title>{title}</Modal.Title>
Expand Down
3 changes: 1 addition & 2 deletions src/components/bookings/timeEstimate/TimeEstimateAddButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,7 @@ const TimeEstimateAddButton: React.FC<Props & React.ComponentProps<typeof Button
...rest
}: Props & React.ComponentProps<typeof Button>) => {
const [timeEstimateViewModel, setTimeEstimateViewModel] = useState<Partial<TimeEstimate> | undefined>(undefined);
const { showCreateSuccessNotification, showCreateFailedNotification } =
useNotifications();
const { showCreateSuccessNotification, showCreateFailedNotification } = useNotifications();

const addTimeEstimate = async (timeEstimate: ITimeEstimateObjectionModel) => {
addTimeEstimateApiCall(timeEstimate, booking.id)
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/timeEstimate/TimeEstimateModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const TimeEstimateModal: React.FC<Props> = ({
};

return (
<Modal show={!!timeEstimate} onHide={() => handleHide()} size="lg">
<Modal show={!!timeEstimate} onHide={() => handleHide()} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>{getTitle()}</Modal.Title>
</Modal.Header>
Expand Down
5 changes: 2 additions & 3 deletions src/components/bookings/timeReport/TimeReportAddButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,12 @@ const TimeReportAddButton: React.FC<Props & React.ComponentProps<typeof Button>>
...rest
}: Props & React.ComponentProps<typeof Button>) => {
const [timeReport, setTimeReport] = useState<Partial<TimeReport> | undefined>(undefined);
const { showCreateSuccessNotification, showCreateFailedNotification } =
useNotifications();
const { showCreateSuccessNotification, showCreateFailedNotification } = useNotifications();

const addTimeReport = (timeReport: ITimeReportObjectionModel) => {
addTimeReportApiCall(timeReport, booking.id)
.then((data) => {
showCreateSuccessNotification("Tidrapporten");
showCreateSuccessNotification('Tidrapporten');
onAdd(data);
})
.catch((error: Error) => {
Expand Down
2 changes: 1 addition & 1 deletion src/components/bookings/timeReport/TimeReportModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ const TimeReportModal: React.FC<Props> = ({
};

return (
<Modal show={!!timeReport} onHide={() => handleHide()} size="lg">
<Modal show={!!timeReport} onHide={() => handleHide()} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>
{readonly ? 'Visa tidsrapport' : timeReport?.id ? 'Redigera tidrapport' : 'Ny tidrapport'}
Expand Down
2 changes: 1 addition & 1 deletion src/components/invoices/CreateInvoiceGroupModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ const CreateInvoiceGroupModal: React.FC<Props> = ({ show, onHide, onCreate }: Pr
}

return (
<Modal show={show} onHide={() => resetAndHide()} size="xl">
<Modal show={show} onHide={() => resetAndHide()} size="xl" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Skapa Fakturaunderlagsgrupp</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/layout/LoggedOutModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ const LoggedOutModal: React.FC<Props> = ({ currentUser, globalSettings }: Props)
const loginPageUrl = '/login?redirectUrl=' + router.asPath;

return (!hideModal && isSoonLoggedOut) || isLoggedOut ? (
<Modal show={true}>
<Modal show={true} backdrop="static">
<Modal.Header>
<Modal.Title>{isLoggedOut ? 'Utloggad' : 'Snart utloggad'}</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/layout/Topbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ const Topbar: React.FC<Props> = ({ currentUser, globalSettings, toggleSidebar }:
</Dropdown>
</Navbar>

<Modal show={showHelpModal} onHide={() => setShowHelpModal(false)} size="xl">
<Modal show={showHelpModal} onHide={() => setShowHelpModal(false)} size="xl" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Hjälp</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/salaries/CreateSalaryGroupModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ const CreateSalaryGroupModal: React.FC<Props> = ({ show, onHide, onCreate }: Pro
}

return (
<Modal show={show} onHide={() => resetAndHide()} size="xl">
<Modal show={show} onHide={() => resetAndHide()} size="xl" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Skapa Timarvodesunderlagsgrupp</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/settings/BaseEntityWithNamesEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -209,7 +209,7 @@ const BaseEntityWithNamesEditor = <T extends BaseEntityWithName>({
Vill du verkligen ta bort {entityToDelete?.name}?
</ConfirmModal>

<Modal show={entityToEdit !== null} onHide={() => setEntityToEdit(null)}>
<Modal show={entityToEdit !== null} onHide={() => setEntityToEdit(null)} backdrop="static">
<Modal.Header closeButton>
<Modal.Title>{readonly ? entityToEdit?.name : 'Redigera ' + entityToEdit?.name}</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/statistics/AccountStatistics.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -387,7 +387,7 @@ const AccountStatisticDetailsModal: React.FC<AccountStatisticDetailsModalProps>
],
};
return (
<Modal show={show} onHide={() => onHide()} size="xl">
<Modal show={show} onHide={() => onHide()} size="xl" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>Detaljer</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/utils/ConfirmModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ const ConfirmModal: React.FC<Props> = ({
children,
}: Props) => {
return (
<Modal show={show} onHide={() => onHide()}>
<Modal show={show} onHide={() => onHide()} backdrop="static">
<Modal.Header closeButton>
<Modal.Title>{title}</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/utils/EditTextModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ const EditTextModal: React.FC<Props> = ({
onCancelCallback ? onCancelCallback() : null;
};
return (
<Modal show={show} onHide={onCancel} size="lg">
<Modal show={show} onHide={onCancel} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title>{modalTitle}</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/utils/setting/SettingsModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ type Props = {

const SettingsModal: React.FC<Props> = ({ setting, onSubmit, onChange, hide, show }: Props) => {
return (
<Modal show={show} onHide={hide} size="lg">
<Modal show={show} onHide={hide} size="lg" backdrop="static">
<Modal.Header closeButton>
<Modal.Title> {setting?.id ? 'Redigera inställning' : 'Lägg till inställning'}</Modal.Title>
</Modal.Header>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/users/[id]/edit.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,7 @@ const UserPage: React.FC<Props> = ({ user: currentUser, globalSettings }: Props)
Vill du verkligen ta bort inloggningsuppgifterna för användaren {user.name}?
</ConfirmModal>

<Modal show={showEditAuthModal} onHide={() => setShowEditAuthModal(false)}>
<Modal show={showEditAuthModal} onHide={() => setShowEditAuthModal(false)} backdrop="static">
<Modal.Header closeButton>
<Modal.Title>{user.username ? 'Redigera inloggningsuppgifter' : 'Skapa inloggning'}</Modal.Title>
</Modal.Header>
Expand Down