Location share type UI (#7924)

* copyright

Signed-off-by: Kerry Archibald <kerrya@element.io>

* empty line

Signed-off-by: Kerry Archibald <kerrya@element.io>

* functional picker

Signed-off-by: Kerry Archibald <kerrya@element.io>

* most style

Signed-off-by: Kerry Archibald <kerrya@element.io>

* nice style for options

Signed-off-by: Kerry Archibald <kerrya@element.io>

* get ShareType test passing

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add maplibre mock

Signed-off-by: Kerry Archibald <kerrya@element.io>

* lint and test

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add section to themes for location sharing cols

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add svg mock

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use same mock string as imageMock

Signed-off-by: Kerry Archibald <kerrya@element.io>

* newline

Signed-off-by: Kerry Archibald <kerrya@element.io>

* lint

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add live location icon

Signed-off-by: Kerry Archibald <kerrya@element.io>

* rename useEnabledShareTypes

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use solid color for live border

* use ternary

Signed-off-by: Kerry Archibald <kerrya@element.io>

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Kerry 2022-03-02 14:00:40 +01:00 committed by GitHub
parent 547144a565
commit b480bffab0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 354 additions and 298 deletions

View file

@ -14,13 +14,15 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { SyntheticEvent, useContext } from 'react';
import React, { SyntheticEvent, useContext, useState } from 'react';
import { Room } from 'matrix-js-sdk/src/models/room';
import MatrixClientContext from '../../../contexts/MatrixClientContext';
import ContextMenu, { AboveLeftOf } from '../../structures/ContextMenu';
import LocationPicker, { ILocationPickerProps } from "./LocationPicker";
import { shareLocation } from './shareLocation';
import SettingsStore from '../../../settings/SettingsStore';
import ShareType, { LocationShareType } from './ShareType';
type Props = Omit<ILocationPickerProps, 'onChoose'> & {
onFinished: (ev?: SyntheticEvent) => void;
@ -29,10 +31,26 @@ type Props = Omit<ILocationPickerProps, 'onChoose'> & {
roomId: Room["roomId"];
};
const getEnabledShareTypes = (): LocationShareType[] => {
const isPinDropLocationShareEnabled = SettingsStore.getValue("feature_location_share_pin_drop");
if (isPinDropLocationShareEnabled) {
return [LocationShareType.Own, LocationShareType.Pin];
}
return [
LocationShareType.Own,
];
};
const LocationShareMenu: React.FC<Props> = ({
menuPosition, onFinished, sender, roomId, openMenu,
}) => {
const matrixClient = useContext(MatrixClientContext);
const enabledShareTypes = getEnabledShareTypes();
const [shareType, setShareType] = useState<LocationShareType>(
enabledShareTypes.length === 1 ? LocationShareType.Own : undefined,
);
return <ContextMenu
{...menuPosition}
@ -40,11 +58,13 @@ const LocationShareMenu: React.FC<Props> = ({
managed={false}
>
<div className="mx_LocationShareMenu">
<LocationPicker
{ shareType ? <LocationPicker
sender={sender}
onChoose={shareLocation(matrixClient, roomId, openMenu)}
onFinished={onFinished}
/>
:
<ShareType setShareType={setShareType} enabledShareTypes={enabledShareTypes} /> }
</div>
</ContextMenu>;
};