yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Move to Typescript (#2783)

Browse Source 
This PR moves the entire project to Typescript. Due to the ~1000 ignores this will lead to a messy codebase for a while, but the churn is worth it – all of those ignore comments are places that were never type-safe previously.

closes #1282
This commit is contained in:
Tom Moor
2021-11-29 06:40:55 -08:00
committed by GitHub
parent 25ccfb5d04
commit 15b1069bcc
1017 changed files with 17410 additions and 54942 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
app/scenes/GroupMembers/AddPeopleToGroup.js → app/scenes/GroupMembers/AddPeopleToGroup.tsx
View File

@@ -1,39 +1,35 @@
// @flow
import { debounce } from "lodash";
import { observable } from "mobx";
import { inject, observer } from "mobx-react";
import { observer } from "mobx-react";
import * as React from "react";
import { withTranslation, type TFunction } from "react-i18next";
import AuthStore from "stores/AuthStore";
import GroupMembershipsStore from "stores/GroupMembershipsStore";
import ToastsStore from "stores/ToastsStore";
import UsersStore from "stores/UsersStore";
import Group from "models/Group";
import User from "models/User";
import Invite from "scenes/Invite";
import ButtonLink from "components/ButtonLink";
import Empty from "components/Empty";
import Flex from "components/Flex";
import HelpText from "components/HelpText";
import Input from "components/Input";
import Modal from "components/Modal";
import PaginatedList from "components/PaginatedList";
import { WithTranslation, withTranslation } from "react-i18next";
import RootStore from "~/stores/RootStore";
import Group from "~/models/Group";
import User from "~/models/User";
import Invite from "~/scenes/Invite";
import ButtonLink from "~/components/ButtonLink";
import Empty from "~/components/Empty";
import Flex from "~/components/Flex";
import HelpText from "~/components/HelpText";
import Input from "~/components/Input";
import Modal from "~/components/Modal";
import PaginatedList from "~/components/PaginatedList";
import withStores from "~/components/withStores";
import GroupMemberListItem from "./components/GroupMemberListItem";
type Props = {
toasts: ToastsStore,
auth: AuthStore,
group: Group,
groupMemberships: GroupMembershipsStore,
users: UsersStore,
onSubmit: () => void,
t: TFunction,
};
type Props = WithTranslation &
RootStore & {
group: Group;
onSubmit: () => void;
};
@observer
class AddPeopleToGroup extends React.Component<Props> {
@observable inviteModalOpen: boolean = false;
@observable query: string = "";
@observable
inviteModalOpen = false;
@observable
query = "";
handleInviteModalOpen = () => {
this.inviteModalOpen = true;
@@ -43,7 +39,7 @@ class AddPeopleToGroup extends React.Component<Props> {
this.inviteModalOpen = false;
};
handleFilter = (ev: SyntheticInputEvent<>) => {
handleFilter = (ev: React.ChangeEvent<HTMLInputElement>) => {
this.query = ev.target.value;
this.debouncedFetch();
};
@@ -63,11 +59,17 @@ class AddPeopleToGroup extends React.Component<Props> {
userId: user.id,
});
this.props.toasts.showToast(
t(`{{userName}} was added to the group`, { userName: user.name }),
{ type: "success" }
t(`{{userName}} was added to the group`, {
userName: user.name,
}),
{
type: "success",
}
);
} catch (err) {
this.props.toasts.showToast(t("Could not add user"), { type: "error" });
this.props.toasts.showToast(t("Could not add user"), {
type: "error",
});
}
};
@@ -83,7 +85,9 @@ class AddPeopleToGroup extends React.Component<Props> {
"Add team members below to give them access to the group. Need to add someone who’s not yet on the team yet?"
)}{" "}
<ButtonLink onClick={this.handleInviteModalOpen}>
{t("Invite them to {{teamName}}", { teamName: team.name })}
{t("Invite them to {{teamName}}", {
teamName: team.name,
})}
</ButtonLink>
.
</HelpText>
@@ -127,6 +131,4 @@ class AddPeopleToGroup extends React.Component<Props> {
}
}
export default withTranslation()<AddPeopleToGroup>(
inject("auth", "users", "groupMemberships", "toasts")(AddPeopleToGroup)
);
export default withTranslation()(withStores(AddPeopleToGroup));

65
app/scenes/GroupMembers/GroupMembers.js → app/scenes/GroupMembers/GroupMembers.tsx
View File

@@ -1,34 +1,33 @@
// @flow
import { observer } from "mobx-react";
import { PlusIcon } from "outline-icons";
import * as React from "react";
import { useTranslation, Trans } from "react-i18next";
import Group from "models/Group";
import User from "models/User";
import Button from "components/Button";
import Empty from "components/Empty";
import Flex from "components/Flex";
import HelpText from "components/HelpText";
import Modal from "components/Modal";
import PaginatedList from "components/PaginatedList";
import Subheading from "components/Subheading";
import Group from "~/models/Group";
import User from "~/models/User";
import Button from "~/components/Button";
import Empty from "~/components/Empty";
import Flex from "~/components/Flex";
import HelpText from "~/components/HelpText";
import Modal from "~/components/Modal";
import PaginatedList from "~/components/PaginatedList";
import Subheading from "~/components/Subheading";
import useStores from "~/hooks/useStores";
import useToasts from "~/hooks/useToasts";
import AddPeopleToGroup from "./AddPeopleToGroup";
import GroupMemberListItem from "./components/GroupMemberListItem";
import useStores from "hooks/useStores";
import useToasts from "hooks/useToasts";
type Props = {
group: Group,
group: Group;
};
function GroupMembers({ group }: Props) {
const [addModalOpen, setAddModalOpen] = React.useState();
const [addModalOpen, setAddModalOpen] = React.useState(false);
const { users, groupMemberships, policies } = useStores();
const { showToast } = useToasts();
const { t } = useTranslation();
const can = policies.abilities(group.id);
const handleAddModal = (state) => {
const handleAddModal = (state: boolean) => {
setAddModalOpen(state);
};
@@ -39,11 +38,17 @@ function GroupMembers({ group }: Props) {
userId: user.id,
});
showToast(
t(`{{userName}} was removed from the group`, { userName: user.name }),
{ type: "success" }
t(`{{userName}} was removed from the group`, {
userName: user.name,
}),
{
type: "success",
}
);
} catch (err) {
showToast(t("Could not remove user"), { type: "error" });
showToast(t("Could not remove user"), {
type: "error",
});
}
};
@@ -54,8 +59,12 @@ function GroupMembers({ group }: Props) {
<HelpText>
<Trans
defaults="Add and remove team members in the <em>{{groupName}}</em> group. Adding people to the group will give them access to any collections this group has been added to."
values={{ groupName: group.name }}
components={{ em: <strong /> }}
values={{
groupName: group.name,
}}
components={{
em: <strong />,
}}
/>
</HelpText>
<span>
@@ -73,8 +82,12 @@ function GroupMembers({ group }: Props) {
<HelpText>
<Trans
defaults="Listing team members in the <em>{{groupName}}</em> group."
values={{ groupName: group.name }}
components={{ em: <strong /> }}
values={{
groupName: group.name,
}}
components={{
em: <strong />,
}}
/>
</HelpText>
)}
@@ -85,7 +98,9 @@ function GroupMembers({ group }: Props) {
<PaginatedList
items={users.inGroup(group.id)}
fetch={groupMemberships.fetchPage}
options={{ id: group.id }}
options={{
id: group.id,
}}
empty={<Empty>{t("This group has no members.")}</Empty>}
renderItem={(item) => (
<GroupMemberListItem
@@ -97,7 +112,9 @@ function GroupMembers({ group }: Props) {
/>
{can.update && (
<Modal
title={t(`Add people to {{groupName}}`, { groupName: group.name })}
title={t(`Add people to {{groupName}}`, {
groupName: group.name,
})}
onRequestClose={() => handleAddModal(false)}
isOpen={addModalOpen}
>

27
app/scenes/GroupMembers/components/GroupMemberListItem.js → app/scenes/GroupMembers/components/GroupMemberListItem.tsx
View File

@@ -1,19 +1,18 @@
// @flow
import * as React from "react";
import User from "models/User";
import Avatar from "components/Avatar";
import Badge from "components/Badge";
import Button from "components/Button";
import Flex from "components/Flex";
import ListItem from "components/List/Item";
import Time from "components/Time";
import GroupMemberMenu from "menus/GroupMemberMenu";
import User from "~/models/User";
import Avatar from "~/components/Avatar";
import Badge from "~/components/Badge";
import Button from "~/components/Button";
import Flex from "~/components/Flex";
import ListItem from "~/components/List/Item";
import Time from "~/components/Time";
import GroupMemberMenu from "~/menus/GroupMemberMenu";
type Props = {|
user: User,
onAdd?: () => Promise<void>,
onRemove?: () => Promise<void>,
|};
type Props = {
user: User;
onAdd?: () => Promise<void>;
onRemove?: () => Promise<void>;
};
const GroupMemberListItem = ({ user, onRemove, onAdd }: Props) => {
return (

19
app/scenes/GroupMembers/components/UserListItem.js → app/scenes/GroupMembers/components/UserListItem.tsx
View File

@@ -1,17 +1,16 @@
// @flow
import { PlusIcon } from "outline-icons";
import * as React from "react";
import User from "models/User";
import Avatar from "components/Avatar";
import Badge from "components/Badge";
import Button from "components/Button";
import ListItem from "components/List/Item";
import Time from "components/Time";
import User from "~/models/User";
import Avatar from "~/components/Avatar";
import Badge from "~/components/Badge";
import Button from "~/components/Button";
import ListItem from "~/components/List/Item";
import Time from "~/components/Time";
type Props = {
user: User,
canEdit: boolean,
onAdd: () => void,
user: User;
canEdit: boolean;
onAdd: () => void;
};
const UserListItem = ({ user, onAdd, canEdit }: Props) => {

2
app/scenes/GroupMembers/index.js → app/scenes/GroupMembers/index.ts
View File

@@ -1,3 +1,3 @@
// @flow
import GroupMembers from "./GroupMembers";
export default GroupMembers;