Apply prettier formatting
This commit is contained in:
Michael Weimann
parent
1cac306093
commit
526645c791
1576 changed files with 65385 additions and 62478 deletions
|
|
@ -14,42 +14,44 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
|
||||
import { MatrixClient } from 'matrix-js-sdk/src/client';
|
||||
import { logger } from 'matrix-js-sdk/src/logger';
|
||||
import React, { useCallback, useContext, useEffect, useRef, useState } from "react";
|
||||
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
|
||||
import { _t } from "../../../../../languageHandler";
|
||||
import MatrixClientContext from '../../../../../contexts/MatrixClientContext';
|
||||
import Modal from '../../../../../Modal';
|
||||
import SettingsSubsection from '../../shared/SettingsSubsection';
|
||||
import SetupEncryptionDialog from '../../../dialogs/security/SetupEncryptionDialog';
|
||||
import VerificationRequestDialog from '../../../dialogs/VerificationRequestDialog';
|
||||
import LogoutDialog from '../../../dialogs/LogoutDialog';
|
||||
import { useOwnDevices } from '../../devices/useOwnDevices';
|
||||
import { FilteredDeviceList } from '../../devices/FilteredDeviceList';
|
||||
import CurrentDeviceSection from '../../devices/CurrentDeviceSection';
|
||||
import SecurityRecommendations from '../../devices/SecurityRecommendations';
|
||||
import { ExtendedDevice } from '../../devices/types';
|
||||
import { deleteDevicesWithInteractiveAuth } from '../../devices/deleteDevices';
|
||||
import SettingsTab from '../SettingsTab';
|
||||
import LoginWithQRSection from '../../devices/LoginWithQRSection';
|
||||
import LoginWithQR, { Mode } from '../../../auth/LoginWithQR';
|
||||
import SettingsStore from '../../../../../settings/SettingsStore';
|
||||
import { useAsyncMemo } from '../../../../../hooks/useAsyncMemo';
|
||||
import QuestionDialog from '../../../dialogs/QuestionDialog';
|
||||
import { FilterVariation } from '../../devices/filter';
|
||||
import MatrixClientContext from "../../../../../contexts/MatrixClientContext";
|
||||
import Modal from "../../../../../Modal";
|
||||
import SettingsSubsection from "../../shared/SettingsSubsection";
|
||||
import SetupEncryptionDialog from "../../../dialogs/security/SetupEncryptionDialog";
|
||||
import VerificationRequestDialog from "../../../dialogs/VerificationRequestDialog";
|
||||
import LogoutDialog from "../../../dialogs/LogoutDialog";
|
||||
import { useOwnDevices } from "../../devices/useOwnDevices";
|
||||
import { FilteredDeviceList } from "../../devices/FilteredDeviceList";
|
||||
import CurrentDeviceSection from "../../devices/CurrentDeviceSection";
|
||||
import SecurityRecommendations from "../../devices/SecurityRecommendations";
|
||||
import { ExtendedDevice } from "../../devices/types";
|
||||
import { deleteDevicesWithInteractiveAuth } from "../../devices/deleteDevices";
|
||||
import SettingsTab from "../SettingsTab";
|
||||
import LoginWithQRSection from "../../devices/LoginWithQRSection";
|
||||
import LoginWithQR, { Mode } from "../../../auth/LoginWithQR";
|
||||
import SettingsStore from "../../../../../settings/SettingsStore";
|
||||
import { useAsyncMemo } from "../../../../../hooks/useAsyncMemo";
|
||||
import QuestionDialog from "../../../dialogs/QuestionDialog";
|
||||
import { FilterVariation } from "../../devices/filter";
|
||||
|
||||
const confirmSignOut = async (sessionsToSignOutCount: number): Promise<boolean> => {
|
||||
const { finished } = Modal.createDialog(QuestionDialog, {
|
||||
title: _t("Sign out"),
|
||||
description: (
|
||||
<div>
|
||||
<p>{ _t("Are you sure you want to sign out of %(count)s sessions?", {
|
||||
count: sessionsToSignOutCount,
|
||||
}) }</p>
|
||||
<p>
|
||||
{_t("Are you sure you want to sign out of %(count)s sessions?", {
|
||||
count: sessionsToSignOutCount,
|
||||
})}
|
||||
</p>
|
||||
</div>
|
||||
),
|
||||
cancelButton: _t('Cancel'),
|
||||
cancelButton: _t("Cancel"),
|
||||
button: _t("Sign out"),
|
||||
});
|
||||
const [confirmed] = await finished;
|
||||
|
|
@ -61,11 +63,11 @@ const useSignOut = (
|
|||
matrixClient: MatrixClient,
|
||||
onSignoutResolvedCallback: () => Promise<void>,
|
||||
): {
|
||||
onSignOutCurrentDevice: () => void;
|
||||
onSignOutOtherDevices: (deviceIds: ExtendedDevice['device_id'][]) => Promise<void>;
|
||||
signingOutDeviceIds: ExtendedDevice['device_id'][];
|
||||
} => {
|
||||
const [signingOutDeviceIds, setSigningOutDeviceIds] = useState<ExtendedDevice['device_id'][]>([]);
|
||||
onSignOutCurrentDevice: () => void;
|
||||
onSignOutOtherDevices: (deviceIds: ExtendedDevice["device_id"][]) => Promise<void>;
|
||||
signingOutDeviceIds: ExtendedDevice["device_id"][];
|
||||
} => {
|
||||
const [signingOutDeviceIds, setSigningOutDeviceIds] = useState<ExtendedDevice["device_id"][]>([]);
|
||||
|
||||
const onSignOutCurrentDevice = () => {
|
||||
Modal.createDialog(
|
||||
|
|
@ -77,7 +79,7 @@ const useSignOut = (
|
|||
);
|
||||
};
|
||||
|
||||
const onSignOutOtherDevices = async (deviceIds: ExtendedDevice['device_id'][]) => {
|
||||
const onSignOutOtherDevices = async (deviceIds: ExtendedDevice["device_id"][]) => {
|
||||
if (!deviceIds.length) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -88,19 +90,15 @@ const useSignOut = (
|
|||
|
||||
try {
|
||||
setSigningOutDeviceIds([...signingOutDeviceIds, ...deviceIds]);
|
||||
await deleteDevicesWithInteractiveAuth(
|
||||
matrixClient,
|
||||
deviceIds,
|
||||
async (success) => {
|
||||
if (success) {
|
||||
await onSignoutResolvedCallback();
|
||||
}
|
||||
setSigningOutDeviceIds(signingOutDeviceIds.filter(deviceId => !deviceIds.includes(deviceId)));
|
||||
},
|
||||
);
|
||||
await deleteDevicesWithInteractiveAuth(matrixClient, deviceIds, async (success) => {
|
||||
if (success) {
|
||||
await onSignoutResolvedCallback();
|
||||
}
|
||||
setSigningOutDeviceIds(signingOutDeviceIds.filter((deviceId) => !deviceIds.includes(deviceId)));
|
||||
});
|
||||
} catch (error) {
|
||||
logger.error("Error deleting sessions", error);
|
||||
setSigningOutDeviceIds(signingOutDeviceIds.filter(deviceId => !deviceIds.includes(deviceId)));
|
||||
setSigningOutDeviceIds(signingOutDeviceIds.filter((deviceId) => !deviceIds.includes(deviceId)));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -125,19 +123,19 @@ const SessionManagerTab: React.FC = () => {
|
|||
supportsMSC3881,
|
||||
} = useOwnDevices();
|
||||
const [filter, setFilter] = useState<FilterVariation>();
|
||||
const [expandedDeviceIds, setExpandedDeviceIds] = useState<ExtendedDevice['device_id'][]>([]);
|
||||
const [selectedDeviceIds, setSelectedDeviceIds] = useState<ExtendedDevice['device_id'][]>([]);
|
||||
const [expandedDeviceIds, setExpandedDeviceIds] = useState<ExtendedDevice["device_id"][]>([]);
|
||||
const [selectedDeviceIds, setSelectedDeviceIds] = useState<ExtendedDevice["device_id"][]>([]);
|
||||
const filteredDeviceListRef = useRef<HTMLDivElement>(null);
|
||||
const scrollIntoViewTimeoutRef = useRef<number>();
|
||||
|
||||
const matrixClient = useContext(MatrixClientContext);
|
||||
const userId = matrixClient.getUserId();
|
||||
const currentUserMember = userId && matrixClient.getUser(userId) || undefined;
|
||||
const currentUserMember = (userId && matrixClient.getUser(userId)) || undefined;
|
||||
const clientVersions = useAsyncMemo(() => matrixClient.getVersions(), [matrixClient]);
|
||||
|
||||
const onDeviceExpandToggle = (deviceId: ExtendedDevice['device_id']): void => {
|
||||
const onDeviceExpandToggle = (deviceId: ExtendedDevice["device_id"]): void => {
|
||||
if (expandedDeviceIds.includes(deviceId)) {
|
||||
setExpandedDeviceIds(expandedDeviceIds.filter(id => id !== deviceId));
|
||||
setExpandedDeviceIds(expandedDeviceIds.filter((id) => id !== deviceId));
|
||||
} else {
|
||||
setExpandedDeviceIds([...expandedDeviceIds, deviceId]);
|
||||
}
|
||||
|
|
@ -147,63 +145,68 @@ const SessionManagerTab: React.FC = () => {
|
|||
setFilter(filter);
|
||||
clearTimeout(scrollIntoViewTimeoutRef.current);
|
||||
// wait a tick for the filtered section to rerender with different height
|
||||
scrollIntoViewTimeoutRef.current =
|
||||
window.setTimeout(() => filteredDeviceListRef.current?.scrollIntoView({
|
||||
scrollIntoViewTimeoutRef.current = window.setTimeout(() =>
|
||||
filteredDeviceListRef.current?.scrollIntoView({
|
||||
// align element to top of scrollbox
|
||||
block: 'start',
|
||||
inline: 'nearest',
|
||||
behavior: 'smooth',
|
||||
}));
|
||||
block: "start",
|
||||
inline: "nearest",
|
||||
behavior: "smooth",
|
||||
}),
|
||||
);
|
||||
};
|
||||
|
||||
const { [currentDeviceId]: currentDevice, ...otherDevices } = devices;
|
||||
const shouldShowOtherSessions = Object.keys(otherDevices).length > 0;
|
||||
|
||||
const onVerifyCurrentDevice = () => {
|
||||
Modal.createDialog(
|
||||
SetupEncryptionDialog as unknown as React.ComponentType,
|
||||
{ onFinished: refreshDevices },
|
||||
);
|
||||
Modal.createDialog(SetupEncryptionDialog as unknown as React.ComponentType, { onFinished: refreshDevices });
|
||||
};
|
||||
|
||||
const onTriggerDeviceVerification = useCallback((deviceId: ExtendedDevice['device_id']) => {
|
||||
if (!requestDeviceVerification) {
|
||||
return;
|
||||
}
|
||||
const verificationRequestPromise = requestDeviceVerification(deviceId);
|
||||
Modal.createDialog(VerificationRequestDialog, {
|
||||
verificationRequestPromise,
|
||||
member: currentUserMember,
|
||||
onFinished: async () => {
|
||||
const request = await verificationRequestPromise;
|
||||
request.cancel();
|
||||
await refreshDevices();
|
||||
},
|
||||
});
|
||||
}, [requestDeviceVerification, refreshDevices, currentUserMember]);
|
||||
const onTriggerDeviceVerification = useCallback(
|
||||
(deviceId: ExtendedDevice["device_id"]) => {
|
||||
if (!requestDeviceVerification) {
|
||||
return;
|
||||
}
|
||||
const verificationRequestPromise = requestDeviceVerification(deviceId);
|
||||
Modal.createDialog(VerificationRequestDialog, {
|
||||
verificationRequestPromise,
|
||||
member: currentUserMember,
|
||||
onFinished: async () => {
|
||||
const request = await verificationRequestPromise;
|
||||
request.cancel();
|
||||
await refreshDevices();
|
||||
},
|
||||
});
|
||||
},
|
||||
[requestDeviceVerification, refreshDevices, currentUserMember],
|
||||
);
|
||||
|
||||
const onSignoutResolvedCallback = async () => {
|
||||
await refreshDevices();
|
||||
setSelectedDeviceIds([]);
|
||||
};
|
||||
const {
|
||||
onSignOutCurrentDevice,
|
||||
onSignOutOtherDevices,
|
||||
signingOutDeviceIds,
|
||||
} = useSignOut(matrixClient, onSignoutResolvedCallback);
|
||||
const { onSignOutCurrentDevice, onSignOutOtherDevices, signingOutDeviceIds } = useSignOut(
|
||||
matrixClient,
|
||||
onSignoutResolvedCallback,
|
||||
);
|
||||
|
||||
useEffect(() => () => {
|
||||
clearTimeout(scrollIntoViewTimeoutRef.current);
|
||||
}, [scrollIntoViewTimeoutRef]);
|
||||
useEffect(
|
||||
() => () => {
|
||||
clearTimeout(scrollIntoViewTimeoutRef.current);
|
||||
},
|
||||
[scrollIntoViewTimeoutRef],
|
||||
);
|
||||
|
||||
// clear selection when filter changes
|
||||
useEffect(() => {
|
||||
setSelectedDeviceIds([]);
|
||||
}, [filter, setSelectedDeviceIds]);
|
||||
|
||||
const signOutAllOtherSessions = shouldShowOtherSessions ? () => {
|
||||
onSignOutOtherDevices(Object.keys(otherDevices));
|
||||
}: undefined;
|
||||
const signOutAllOtherSessions = shouldShowOtherSessions
|
||||
? () => {
|
||||
onSignOutOtherDevices(Object.keys(otherDevices));
|
||||
}
|
||||
: undefined;
|
||||
|
||||
const [signInWithQrMode, setSignInWithQrMode] = useState<Mode | null>();
|
||||
|
||||
|
|
@ -218,65 +221,61 @@ const SessionManagerTab: React.FC = () => {
|
|||
}, [setSignInWithQrMode]);
|
||||
|
||||
if (showQrCodeEnabled && signInWithQrMode) {
|
||||
return <LoginWithQR
|
||||
mode={signInWithQrMode}
|
||||
onFinished={onQrFinish}
|
||||
client={matrixClient}
|
||||
/>;
|
||||
return <LoginWithQR mode={signInWithQrMode} onFinished={onQrFinish} client={matrixClient} />;
|
||||
}
|
||||
|
||||
return <SettingsTab heading={_t('Sessions')}>
|
||||
<SecurityRecommendations
|
||||
devices={devices}
|
||||
goToFilteredList={onGoToFilteredList}
|
||||
currentDeviceId={currentDeviceId}
|
||||
/>
|
||||
<CurrentDeviceSection
|
||||
device={currentDevice}
|
||||
localNotificationSettings={localNotificationSettings.get(currentDeviceId)}
|
||||
setPushNotifications={setPushNotifications}
|
||||
isSigningOut={signingOutDeviceIds.includes(currentDeviceId)}
|
||||
isLoading={isLoadingDeviceList}
|
||||
saveDeviceName={(deviceName) => saveDeviceName(currentDeviceId, deviceName)}
|
||||
onVerifyCurrentDevice={onVerifyCurrentDevice}
|
||||
onSignOutCurrentDevice={onSignOutCurrentDevice}
|
||||
signOutAllOtherSessions={signOutAllOtherSessions}
|
||||
/>
|
||||
{
|
||||
shouldShowOtherSessions &&
|
||||
<SettingsSubsection
|
||||
heading={_t('Other sessions')}
|
||||
description={_t(
|
||||
`For best security, verify your sessions and sign out ` +
|
||||
`from any session that you don't recognize or use anymore.`,
|
||||
)}
|
||||
data-testid='other-sessions-section'
|
||||
>
|
||||
<FilteredDeviceList
|
||||
devices={otherDevices}
|
||||
pushers={pushers}
|
||||
localNotificationSettings={localNotificationSettings}
|
||||
filter={filter}
|
||||
expandedDeviceIds={expandedDeviceIds}
|
||||
signingOutDeviceIds={signingOutDeviceIds}
|
||||
selectedDeviceIds={selectedDeviceIds}
|
||||
setSelectedDeviceIds={setSelectedDeviceIds}
|
||||
onFilterChange={setFilter}
|
||||
onDeviceExpandToggle={onDeviceExpandToggle}
|
||||
onRequestDeviceVerification={requestDeviceVerification ? onTriggerDeviceVerification : undefined}
|
||||
onSignOutDevices={onSignOutOtherDevices}
|
||||
saveDeviceName={saveDeviceName}
|
||||
setPushNotifications={setPushNotifications}
|
||||
ref={filteredDeviceListRef}
|
||||
supportsMSC3881={supportsMSC3881}
|
||||
/>
|
||||
</SettingsSubsection>
|
||||
}
|
||||
{ showQrCodeEnabled ?
|
||||
<LoginWithQRSection onShowQr={onShowQrClicked} versions={clientVersions} />
|
||||
: null
|
||||
}
|
||||
</SettingsTab>;
|
||||
return (
|
||||
<SettingsTab heading={_t("Sessions")}>
|
||||
<SecurityRecommendations
|
||||
devices={devices}
|
||||
goToFilteredList={onGoToFilteredList}
|
||||
currentDeviceId={currentDeviceId}
|
||||
/>
|
||||
<CurrentDeviceSection
|
||||
device={currentDevice}
|
||||
localNotificationSettings={localNotificationSettings.get(currentDeviceId)}
|
||||
setPushNotifications={setPushNotifications}
|
||||
isSigningOut={signingOutDeviceIds.includes(currentDeviceId)}
|
||||
isLoading={isLoadingDeviceList}
|
||||
saveDeviceName={(deviceName) => saveDeviceName(currentDeviceId, deviceName)}
|
||||
onVerifyCurrentDevice={onVerifyCurrentDevice}
|
||||
onSignOutCurrentDevice={onSignOutCurrentDevice}
|
||||
signOutAllOtherSessions={signOutAllOtherSessions}
|
||||
/>
|
||||
{shouldShowOtherSessions && (
|
||||
<SettingsSubsection
|
||||
heading={_t("Other sessions")}
|
||||
description={_t(
|
||||
`For best security, verify your sessions and sign out ` +
|
||||
`from any session that you don't recognize or use anymore.`,
|
||||
)}
|
||||
data-testid="other-sessions-section"
|
||||
>
|
||||
<FilteredDeviceList
|
||||
devices={otherDevices}
|
||||
pushers={pushers}
|
||||
localNotificationSettings={localNotificationSettings}
|
||||
filter={filter}
|
||||
expandedDeviceIds={expandedDeviceIds}
|
||||
signingOutDeviceIds={signingOutDeviceIds}
|
||||
selectedDeviceIds={selectedDeviceIds}
|
||||
setSelectedDeviceIds={setSelectedDeviceIds}
|
||||
onFilterChange={setFilter}
|
||||
onDeviceExpandToggle={onDeviceExpandToggle}
|
||||
onRequestDeviceVerification={
|
||||
requestDeviceVerification ? onTriggerDeviceVerification : undefined
|
||||
}
|
||||
onSignOutDevices={onSignOutOtherDevices}
|
||||
saveDeviceName={saveDeviceName}
|
||||
setPushNotifications={setPushNotifications}
|
||||
ref={filteredDeviceListRef}
|
||||
supportsMSC3881={supportsMSC3881}
|
||||
/>
|
||||
</SettingsSubsection>
|
||||
)}
|
||||
{showQrCodeEnabled ? <LoginWithQRSection onShowQr={onShowQrClicked} versions={clientVersions} /> : null}
|
||||
</SettingsTab>
|
||||
);
|
||||
};
|
||||
|
||||
export default SessionManagerTab;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue