LLS: expose way to enable live sharing labs flag from location dialog (#8416)
* add state for waiting for labs flag Signed-off-by: Kerry Archibald <kerrya@element.io> * add enable live share component Signed-off-by: Kerry Archibald <kerrya@element.io> * test enabling live share labs flag Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
45180111d0
commit
699a9aeaaf
7 changed files with 330 additions and 35 deletions
63
src/components/views/location/EnableLiveShare.tsx
Normal file
63
src/components/views/location/EnableLiveShare.tsx
Normal file
|
@ -0,0 +1,63 @@
|
|||
/*
|
||||
Copyright 2022 The Matrix.org Foundation C.I.C.
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the 'License');
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an 'AS IS' BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
import React, { useState } from 'react';
|
||||
|
||||
import { _t } from '../../../languageHandler';
|
||||
import StyledLiveBeaconIcon from '../beacon/StyledLiveBeaconIcon';
|
||||
import AccessibleButton from '../elements/AccessibleButton';
|
||||
import LabelledToggleSwitch from '../elements/LabelledToggleSwitch';
|
||||
import Heading from '../typography/Heading';
|
||||
|
||||
interface Props {
|
||||
onSubmit: () => void;
|
||||
}
|
||||
|
||||
export const EnableLiveShare: React.FC<Props> = ({
|
||||
onSubmit,
|
||||
}) => {
|
||||
const [isEnabled, setEnabled] = useState(false);
|
||||
return (
|
||||
<div data-test-id='location-picker-enable-live-share' className='mx_EnableLiveShare'>
|
||||
<StyledLiveBeaconIcon className='mx_EnableLiveShare_icon' />
|
||||
<Heading className='mx_EnableLiveShare_heading' size='h3'>{ _t('Live location sharing') }</Heading>
|
||||
<p className='mx_EnableLiveShare_description'>
|
||||
{ _t(
|
||||
'Please note: this is a labs feature using a temporary implementation. ' +
|
||||
'This means you will not be able to delete your location history, ' +
|
||||
'and advanced users will be able to see your location history ' +
|
||||
'even after you stop sharing your live location with this room.',
|
||||
) }
|
||||
</p>
|
||||
<LabelledToggleSwitch
|
||||
data-test-id='enable-live-share-toggle'
|
||||
value={isEnabled}
|
||||
onChange={setEnabled}
|
||||
label={_t('Enable live location sharing')}
|
||||
/>
|
||||
<AccessibleButton
|
||||
data-test-id='enable-live-share-submit'
|
||||
className='mx_EnableLiveShare_button'
|
||||
element='button'
|
||||
kind='primary'
|
||||
onClick={onSubmit}
|
||||
disabled={!isEnabled}
|
||||
>
|
||||
{ _t('OK') }
|
||||
</AccessibleButton>
|
||||
</div>
|
||||
);
|
||||
};
|
|
@ -27,6 +27,9 @@ import ShareDialogButtons from './ShareDialogButtons';
|
|||
import ShareType from './ShareType';
|
||||
import { LocationShareType } from './shareLocation';
|
||||
import { OwnProfileStore } from '../../../stores/OwnProfileStore';
|
||||
import { EnableLiveShare } from './EnableLiveShare';
|
||||
import { useFeatureEnabled } from '../../../hooks/useSettings';
|
||||
import { SettingLevel } from '../../../settings/SettingLevel';
|
||||
|
||||
type Props = Omit<ILocationPickerProps, 'onChoose' | 'shareType'> & {
|
||||
onFinished: (ev?: SyntheticEvent) => void;
|
||||
|
@ -37,11 +40,7 @@ type Props = Omit<ILocationPickerProps, 'onChoose' | 'shareType'> & {
|
|||
};
|
||||
|
||||
const getEnabledShareTypes = (): LocationShareType[] => {
|
||||
const enabledShareTypes = [LocationShareType.Own];
|
||||
|
||||
if (SettingsStore.getValue("feature_location_share_live")) {
|
||||
enabledShareTypes.push(LocationShareType.Live);
|
||||
}
|
||||
const enabledShareTypes = [LocationShareType.Own, LocationShareType.Live];
|
||||
|
||||
if (SettingsStore.getValue("feature_location_share_pin_drop")) {
|
||||
enabledShareTypes.push(LocationShareType.Pin);
|
||||
|
@ -60,6 +59,7 @@ const LocationShareMenu: React.FC<Props> = ({
|
|||
}) => {
|
||||
const matrixClient = useContext(MatrixClientContext);
|
||||
const enabledShareTypes = getEnabledShareTypes();
|
||||
const isLiveShareEnabled = useFeatureEnabled("feature_location_share_live");
|
||||
|
||||
const multipleShareTypesEnabled = enabledShareTypes.length > 1;
|
||||
|
||||
|
@ -73,19 +73,32 @@ const LocationShareMenu: React.FC<Props> = ({
|
|||
shareLiveLocation(matrixClient, roomId, displayName, openMenu) :
|
||||
shareLocation(matrixClient, roomId, shareType, relation, openMenu);
|
||||
|
||||
const onLiveShareEnableSubmit = () => {
|
||||
SettingsStore.setValue("feature_location_share_live", undefined, SettingLevel.DEVICE, true);
|
||||
};
|
||||
|
||||
const shouldAdvertiseLiveLabsFlag = shareType === LocationShareType.Live && !isLiveShareEnabled;
|
||||
|
||||
return <ContextMenu
|
||||
{...menuPosition}
|
||||
onFinished={onFinished}
|
||||
managed={false}
|
||||
>
|
||||
<div className="mx_LocationShareMenu">
|
||||
{ shareType ?
|
||||
{ shouldAdvertiseLiveLabsFlag &&
|
||||
<EnableLiveShare
|
||||
onSubmit={onLiveShareEnableSubmit}
|
||||
/>
|
||||
}
|
||||
{ !shouldAdvertiseLiveLabsFlag && !!shareType &&
|
||||
<LocationPicker
|
||||
sender={sender}
|
||||
shareType={shareType}
|
||||
onChoose={onLocationSubmit}
|
||||
onFinished={onFinished}
|
||||
/> :
|
||||
/>
|
||||
}
|
||||
{ !shareType &&
|
||||
<ShareType setShareType={setShareType} enabledShareTypes={enabledShareTypes} />
|
||||
}
|
||||
<ShareDialogButtons displayBack={!!shareType && multipleShareTypesEnabled} onBack={() => setShareType(undefined)} onCancel={onFinished} />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue