muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 11:06:40 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixed imports

Browse source
This commit is contained in:
Fedor Katurov 2020-01-08 12:51:19 +07:00
parent 23c9e42bd5
commit 103097edbd
50 changed files with 260 additions and 229 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/Cursor.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
import { MODES } from '$constants/modes';
import { IStickerPack, STICKERS } from '$constants/stickers';

2
src/components/Fills.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
export const Fills = () => (
<svg>

2
src/components/Scroll.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Scrollbars } from 'tt-react-custom-scrollbars';
export const Scroll = props => (

2
src/components/StickerDesc.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import classnames from 'classnames';
interface Props {

2
src/components/StickerIcon.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { STICKERS } from '$constants/stickers';
type Props = {

2
src/components/Switch.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from 'react';
import React from 'react';
import classnames from 'classnames';
type Props = {

2
src/components/UserLocation.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
// import { marker } from 'leaflet';
// import { DomMarker } from '$utils/DomMarker';
// import { Icon } from '$components/panels/Icon';

2
src/components/dialogs/AppInfoDialog.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from 'react';
import React from 'react';
import { Scroll } from '$components/Scroll';
import { APP_INFO } from '$constants/app_info';

2
src/components/dialogs/CancelDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { MODES } from '$constants/modes';
import { Icon } from '$components/panels/Icon';

2
src/components/dialogs/LogoDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { LOGOS } from '$constants/logos';
import { Icon } from '$components/panels/Icon';
import classnames from 'classnames';

276
src/components/dialogs/MapListDialog.tsx
View file

@ -1,5 +1,4 @@
import * as React from 'react';
import { bindActionCreators } from 'redux';
import React from 'react';
import { connect } from 'react-redux';
import { RouteRowWrapper } from '$components/maps/RouteRowWrapper';
import { Scroll } from '$components/Scroll';
@ -10,44 +9,46 @@ import {
setDialogActive,
mapsLoadMore,
dropRoute,
modifyRoute, toggleRouteStarred,
modifyRoute,
toggleRouteStarred,
} from '$redux/user/actions';
import { isMobile } from '$utils/window';
import classnames from 'classnames';
import * as Range from 'rc-slider/lib/Range';
import Range from 'rc-slider/lib/Range';
import { TABS, TABS_TITLES } from '$constants/dialogs';
import { Icon } from '$components/panels/Icon';
import { pushPath } from '$utils/history';
import { IRootState, IRouteListItem } from '$redux/user';
import { ROLES } from "$constants/auth";
import { ROLES } from '$constants/auth';
import { IState } from '$redux/store';
export interface IMapListDialogProps extends IRootState {
marks: { [x: number]: string },
routes_sorted: Array<IRouteListItem>,
routes: IRootState['routes'],
ready: IRootState['ready'],
role: IRootState['user']['role'],
marks: { [x: number]: string };
routes_sorted: Array<IRouteListItem>;
routes: IRootState['routes'];
ready: IRootState['ready'];
role: IRootState['user']['role'];
mapsLoadMore: typeof mapsLoadMore,
searchSetDistance: typeof searchSetDistance,
searchSetTitle: typeof searchSetTitle,
searchSetTab: typeof searchSetTab,
setDialogActive: typeof setDialogActive,
dropRoute: typeof dropRoute,
modifyRoute: typeof modifyRoute,
toggleRouteStarred: typeof toggleRouteStarred,
mapsLoadMore: typeof mapsLoadMore;
searchSetDistance: typeof searchSetDistance;
searchSetTitle: typeof searchSetTitle;
searchSetTab: typeof searchSetTab;
setDialogActive: typeof setDialogActive;
dropRoute: typeof dropRoute;
modifyRoute: typeof modifyRoute;
toggleRouteStarred: typeof toggleRouteStarred;
}
export interface IMapListDialogState {
menu_target: IRouteListItem['address'],
editor_target: IRouteListItem['address'],
menu_target: IRouteListItem['address'];
editor_target: IRouteListItem['address'];
is_editing: boolean,
is_dropping: boolean,
is_editing: boolean;
is_dropping: boolean;
}
class Component extends React.Component<IMapListDialogProps, IMapListDialogState> {
class MapListDialogUnconnected extends React.Component<IMapListDialogProps, IMapListDialogState> {
state = {
menu_target: null,
editor_target: null,
@ -56,33 +57,37 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
is_dropping: false,
};
startEditing = (editor_target: IRouteListItem['address']): void => this.setState({
editor_target,
menu_target: null,
is_editing: true,
is_dropping: false,
});
startEditing = (editor_target: IRouteListItem['address']): void =>
this.setState({
editor_target,
menu_target: null,
is_editing: true,
is_dropping: false,
});
showMenu = (menu_target: IRouteListItem['address']): void => this.setState({
menu_target,
});
showMenu = (menu_target: IRouteListItem['address']): void =>
this.setState({
menu_target,
});
hideMenu = (): void => this.setState({
menu_target: null,
});
hideMenu = (): void =>
this.setState({
menu_target: null,
});
showDropCard = (editor_target: IRouteListItem['address']): void => this.setState({
editor_target,
menu_target: null,
is_editing: false,
is_dropping: true,
});
showDropCard = (editor_target: IRouteListItem['address']): void =>
this.setState({
editor_target,
menu_target: null,
is_editing: false,
is_dropping: true,
});
stopEditing = (): void => {
this.setState({ editor_target: null });
};
setTitle = ({ target: { value } }: { target: { value: string }}): void => {
setTitle = ({ target: { value } }: { target: { value: string } }): void => {
this.props.searchSetTitle(value);
};
@ -97,8 +102,12 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
// pushPath(`/${_id}/${this.props.editing ? 'edit' : ''}`);
};
onScroll = (e: { target: { scrollHeight: number, scrollTop: number, clientHeight: number }}): void => {
const { target: { scrollHeight, scrollTop, clientHeight }} = e;
onScroll = (e: {
target: { scrollHeight: number; scrollTop: number; clientHeight: number };
}): void => {
const {
target: { scrollHeight, scrollTop, clientHeight },
} = e;
const delta = scrollHeight - scrollTop - clientHeight;
if (
@ -114,7 +123,15 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
this.props.dropRoute(address);
};
modifyRoute = ({ address, title, is_public }: { address: string, title: string, is_public: boolean }): void => {
modifyRoute = ({
address,
title,
is_public,
}: {
address: string;
title: string;
is_public: boolean;
}): void => {
this.props.modifyRoute(address, { title, is_public });
this.stopEditing();
};
@ -128,13 +145,7 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
routes: {
list,
loading,
filter: {
min,
max,
title,
distance,
tab,
}
filter: { min, max, title, distance, tab },
},
marks,
}: IMapListDialogProps = this.props;
@ -143,34 +154,34 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
return (
<div className="dialog-content">
{ list.length === 0 && loading &&
{list.length === 0 && loading && (
<div className="dialog-maplist-loader">
<div className="dialog-maplist-icon spin">
<Icon icon="icon-sync-1" />
</div>
</div>
}
{ ready && !loading && list.length === 0 &&
)}
{ready && !loading && list.length === 0 && (
<div className="dialog-maplist-loader">
<div className="dialog-maplist-icon">
<Icon icon="icon-sad-1" />
</div>
ТУТ ПУСТО <br />
И ОДИНОКО
ТУТ ПУСТО <br />И ОДИНОКО
</div>
}
)}
<div className="dialog-tabs">
{
Object.values(TABS).map(item => (role === ROLES.admin || item !== TABS.PENDING) && (
<div
className={classnames('dialog-tab', { active: tab === item })}
onClick={() => this.props.searchSetTab(item)}
key={item}
>
{TABS_TITLES[item]}
</div>
))
}
{Object.values(TABS).map(
item =>
(role === ROLES.admin || item !== TABS.PENDING) && (
<div
className={classnames('dialog-tab', { active: tab === item })}
onClick={() => this.props.searchSetTab(item)}
key={item}
>
{TABS_TITLES[item]}
</div>
)
)}
</div>
<div className="dialog-head">
<div>
@ -181,57 +192,50 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
onChange={this.setTitle}
/>
<br />
{
ready && Object.keys(marks).length > 2
?
<Range
min={min}
max={max}
marks={marks}
step={25}
onChange={this.props.searchSetDistance}
defaultValue={[0, 10000]}
value={distance}
pushable={25}
disabled={min >= max}
/>
: <div className="range-placeholder" />
}
{ready && Object.keys(marks).length > 2 ? (
<Range
min={min}
max={max}
marks={marks}
step={25}
onChange={this.props.searchSetDistance}
defaultValue={[0, 10000]}
value={distance}
pushable={25}
disabled={min >= max}
/>
) : (
<div className="range-placeholder" />
)}
</div>
</div>
<Scroll
className="dialog-shader"
onScroll={this.onScroll}
>
<Scroll className="dialog-shader" onScroll={this.onScroll}>
<div className="dialog-maplist">
{
list.map(route => (
<RouteRowWrapper
title={route.title}
distance={route.distance}
address={route.address}
is_public={route.is_public}
is_published={route.is_published}
tab={tab}
is_editing_mode={is_dropping ? 'drop' : 'edit'}
is_editing_target={editor_target === route.address}
is_menu_target={menu_target === route.address}
openRoute={this.openRoute}
startEditing={this.startEditing}
stopEditing={this.stopEditing}
showMenu={this.showMenu}
hideMenu={this.hideMenu}
showDropCard={this.showDropCard}
dropRoute={this.dropRoute}
modifyRoute={this.modifyRoute}
toggleStarred={this.toggleStarred}
key={route.address}
is_admin={role === ROLES.admin}
/>
))
}
{list.map(route => (
<RouteRowWrapper
title={route.title}
distance={route.distance}
address={route.address}
is_public={route.is_public}
is_published={route.is_published}
tab={tab}
is_editing_mode={is_dropping ? 'drop' : 'edit'}
is_editing_target={editor_target === route.address}
is_menu_target={menu_target === route.address}
openRoute={this.openRoute}
startEditing={this.startEditing}
stopEditing={this.stopEditing}
showMenu={this.showMenu}
hideMenu={this.hideMenu}
showDropCard={this.showDropCard}
dropRoute={this.dropRoute}
modifyRoute={this.modifyRoute}
toggleStarred={this.toggleStarred}
key={route.address}
is_admin={role === ROLES.admin}
/>
))}
</div>
</Scroll>
@ -241,28 +245,42 @@ class Component extends React.Component<IMapListDialogProps, IMapListDialogState
}
}
const mapStateToProps = ({ user: { editing, routes, user: { role } } }: { user: IRootState }) => {
const mapStateToProps = ({
user: {
editing,
routes,
user: { role },
},
}: IState) => {
if (routes.filter.max >= 9999) {
return {
routes, editing, marks: {}, ready: false, role,
routes,
editing,
marks: {},
ready: false,
role,
};
}
return ({
return {
role,
routes,
editing,
ready: true,
marks: [...new Array(Math.floor((routes.filter.max - routes.filter.min) / 25) + 1)].reduce((obj, el, i) => ({
...obj,
[routes.filter.min + (i * 25)]:
` ${routes.filter.min + (i * 25)}${(routes.filter.min + (i * 25) >= 200) ? '+' : ''}
marks: [...new Array(Math.floor((routes.filter.max - routes.filter.min) / 25) + 1)].reduce(
(obj, el, i) => ({
...obj,
[routes.filter.min + i * 25]: ` ${routes.filter.min + i * 25}${
routes.filter.min + i * 25 >= 200 ? '+' : ''
}
`,
}), {}),
});
}),
{}
),
};
};
const mapDispatchToProps = dispatch => bindActionCreators({
const mapDispatchToProps = {
searchSetDistance,
searchSetTitle,
searchSetTab,
@ -271,6 +289,8 @@ const mapDispatchToProps = dispatch => bindActionCreators({
dropRoute,
modifyRoute,
toggleRouteStarred,
}, dispatch);
};
export const MapListDialog = connect(mapStateToProps, mapDispatchToProps)(Component);
const MapListDialog = connect(mapStateToProps, mapDispatchToProps)(MapListDialogUnconnected);
export { MapListDialog };

2
src/components/dialogs/ProviderDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { PROVIDERS, replaceProviderUrl } from '$constants/providers';
import { Icon } from '$components/panels/Icon';
import classnames from 'classnames';

2
src/components/dialogs/RouterDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
import {
routerCancel as routerCancelAction,

2
src/components/dialogs/SaveDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { copyToClipboard, getUrlData } from '$utils/history';
import { toTranslit, parseDesc } from '$utils/format';
import { TIPS } from '$constants/tips';

21
src/components/dialogs/ShotPrefetchDialog.tsx
View file

@ -1,13 +1,14 @@
import * as React from 'react';
import React from 'react';
import { connect } from 'react-redux';
import { selectUserRenderer } from '$redux/user/selectors';
interface Props {
renderer: {
info: string,
progress: number,
}
}
const mapStateToProps = state => ({
renderer: selectUserRenderer(state),
});
export const ShotPrefetchDialog = ({ renderer: { info, progress }}: Props) => (
type Props = ReturnType<typeof mapStateToProps> & {};
const ShotPrefetchDialogUnconnected = ({ renderer: { info, progress }}: Props) => (
<div className="control-dialog control-dialog-small left">
<div className="helper helper-prefetch">
<div className="dialog-prefetch-stage">{info}</div>
@ -19,3 +20,7 @@ export const ShotPrefetchDialog = ({ renderer: { info, progress }}: Props) => (
</div>
</div>
);
const ShotPrefetchDialog = connect(mapStateToProps)(ShotPrefetchDialogUnconnected);
export { ShotPrefetchDialog }

2
src/components/dialogs/StickersDialog.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from 'react';
import React from 'react';
import { STICKERS } from '$constants/stickers';
import { setActiveSticker as setActiveStickerAction } from "$redux/user/actions";

2
src/components/dialogs/TitleDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { bindActionCreators } from "redux";
import { connect } from 'react-redux';

2
src/components/dialogs/TrashDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
type Props = {

2
src/components/logo/LogoPreview.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { LOGOS } from '$constants/logos';
import { connect } from 'react-redux';
import { IRootState } from '$redux/user';

2
src/components/maps/RouteRowDrop.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
import { MapListDialog } from "$components/dialogs/MapListDialog";
import { Tooltip } from "$components/panels/Tooltip";

2
src/components/maps/RouteRowEditor.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
import { Switch } from '$components/Switch';
import { MapListDialog } from "$components/dialogs/MapListDialog";

2
src/components/maps/RouteRowView.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from "react";
import React from "react";
import { Icon } from "$components/panels/Icon";
import { MapListDialog } from "$components/dialogs/MapListDialog";
import { Tooltip } from "$components/panels/Tooltip";

2
src/components/maps/RouteRowWrapper.tsx
View file

@ -1,4 +1,4 @@
import * as React from "react";
import React from "react";
import classnames from "classnames";
import { MapListDialog } from "$components/dialogs/MapListDialog";
import { RouteRowView } from "$components/maps/RouteRowView";

4
src/components/panels/DistanceBar.tsx
View file

@ -1,10 +1,10 @@
// flow
import * as React from 'react';
import React from 'react';
import { toHours } from '$utils/format';
import { Icon } from '$components/panels/Icon';
import { connect } from 'react-redux';
// import Slider from 'rc-slider';
import * as Slider from 'rc-slider/lib/Slider';
import Slider from 'rc-slider/lib/Slider';
import { bindActionCreators } from 'redux';
import { setSpeed } from '$redux/user/actions';
import { IRootState } from "$redux/user";

4
src/components/panels/EditorDialog.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React, { createElement } from 'react';
import { MODES } from '$constants/modes';
import { RouterDialog } from '$components/dialogs/RouterDialog';
@ -52,7 +52,7 @@ const DIALOG_CONTENTS: { [x: string]: any } = {
export const Component = (props: Props) =>
props.mode && DIALOG_CONTENTS[props.mode]
? React.createElement(DIALOG_CONTENTS[props.mode])
? createElement(DIALOG_CONTENTS[props.mode])
: null;
export const EditorDialog = connect(

2
src/components/panels/EditorPanel.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { MODES } from '$constants/modes';
import classnames from 'classnames';

2
src/components/panels/Icon.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
export const Icon = ({ icon, size = 32 }: { icon: string, size?: number }) => (
<svg width={size} height={size} viewBox="0 0 32 32">

2
src/components/panels/RendererPanel.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
type Props = {

2
src/components/panels/Tooltip.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import classnames from 'classnames';
export const Tooltip = ({ children, position = 'bottom' }: { children: string, position?: string }) => (

2
src/components/panels/TopLeftPanel.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { UserLocation } from '$components/UserLocation';
import { DistanceBar } from '$components/panels/DistanceBar';

2
src/components/panels/TopRightPanel.tsx
View file

@ -1,5 +1,5 @@
// flow
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
import { PROVIDERS } from '$constants/providers';
import { LOGOS } from '$constants/logos';

2
src/components/panels/UserPanel.tsx
View file

@ -1,4 +1,4 @@
import * as React from "react";
import React from "react";
import { GuestButton } from "$components/user/GuestButton";
import { DEFAULT_USER, IUser, ROLES } from "$constants/auth";

4
src/components/renderer/Renderer.tsx
View file

@ -1,9 +1,9 @@
import * as React from 'react';
import React from 'react';
import { hideRenderer, cropAShot } from '$redux/user/actions';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import * as Croppr from 'croppr';
import Croppr from 'croppr';
import 'croppr/dist/croppr.css';
import { LOGOS } from '$constants/logos';
import { RendererPanel } from '$components/panels/RendererPanel';

2
src/components/user/GuestButton.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { Icon } from '$components/panels/Icon';
type Props = {

2
src/components/user/UserButton.tsx
View file

@ -1,5 +1,5 @@
// @flow
import * as React from "react";
import React from "react";
import { UserPicture } from "$components/user/UserPicture";
import { IUser } from "$constants/auth";

2
src/components/user/UserMenu.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
import { APP_INFO } from '$constants/app_info';
import { userLogout } from "$redux/user/actions";

2
src/components/user/UserPicture.tsx
View file

@ -1,4 +1,4 @@
import * as React from 'react';
import React from 'react';
export const UserPicture = ({ photo }) => (
<div