Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(twitter-dm): add twitter direct message feature
close #1127
- Loading branch information
1 parent
7d51321
commit 9c3f01c
Showing
10 changed files
with
220 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
80 changes: 80 additions & 0 deletions
80
src/modules/settings/integrations/components/twitter/Twitter.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| import FormControl from 'modules/common/components/form/Control'; | ||
| import Form from 'modules/common/components/form/Form'; | ||
| import FormGroup from 'modules/common/components/form/Group'; | ||
| import ControlLabel from 'modules/common/components/form/Label'; | ||
| import Spinner from 'modules/common/components/Spinner'; | ||
| import { ModalFooter } from 'modules/common/styles/main'; | ||
| import { IButtonMutateProps, IFormProps } from 'modules/common/types'; | ||
| import * as React from 'react'; | ||
| import Accounts from '../../containers/Accounts'; | ||
| import SelectBrand from '../../containers/SelectBrand'; | ||
|
|
||
| type Props = { | ||
| renderButton: (props: IButtonMutateProps) => JSX.Element; | ||
| onAccountSelect: (accountId?: string) => void; | ||
| onRemoveAccount: (accountId: string) => void; | ||
| closeModal: () => void; | ||
| accountId: string; | ||
| twitterAccountId: string; | ||
| }; | ||
|
|
||
| class Twitter extends React.Component<Props, { loading: boolean }> { | ||
| constructor(props: Props) { | ||
| super(props); | ||
|
|
||
| this.state = { | ||
| loading: false | ||
| }; | ||
| } | ||
|
|
||
| generateDoc = (values: { name: string; brandId: string }) => { | ||
| const { accountId, twitterAccountId } = this.props; | ||
|
|
||
| return { | ||
| ...values, | ||
| kind: 'twitter-dm', | ||
| accountId, | ||
| data: { twitterAccountId } | ||
| }; | ||
| }; | ||
|
|
||
| renderContent = (formProps: IFormProps) => { | ||
| const { onRemoveAccount, onAccountSelect, renderButton } = this.props; | ||
| const { values, isSubmitted } = formProps; | ||
|
|
||
| return ( | ||
| <> | ||
| {this.state.loading && <Spinner />} | ||
| <FormGroup> | ||
| <ControlLabel required={true}>Name</ControlLabel> | ||
| <FormControl {...formProps} name="name" required={true} /> | ||
| </FormGroup> | ||
|
|
||
| <SelectBrand isRequired={true} formProps={formProps} /> | ||
|
|
||
| <Accounts | ||
| kind="twitter" | ||
| addLink="twitter/login" | ||
| onSelect={onAccountSelect} | ||
| onRemove={onRemoveAccount} | ||
| formProps={formProps} | ||
| /> | ||
|
|
||
| <ModalFooter> | ||
| {renderButton({ | ||
| name: 'integration', | ||
| values: this.generateDoc(values), | ||
| isSubmitted, | ||
| callback: this.props.closeModal | ||
| })} | ||
| </ModalFooter> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| render() { | ||
| return <Form renderContent={this.renderContent} />; | ||
| } | ||
| } | ||
|
|
||
| export default Twitter; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
97 changes: 97 additions & 0 deletions
97
src/modules/settings/integrations/containers/twitter/Twitter.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| import client from 'apolloClient'; | ||
| import gql from 'graphql-tag'; | ||
| import ButtonMutate from 'modules/common/components/ButtonMutate'; | ||
| import { IButtonMutateProps, IRouterProps } from 'modules/common/types'; | ||
| import { Alert } from 'modules/common/utils'; | ||
| import { mutations, queries } from 'modules/settings/integrations/graphql'; | ||
| import * as React from 'react'; | ||
| import { withRouter } from 'react-router'; | ||
| import Twitter from '../../components/twitter/Twitter'; | ||
| import { getRefetchQueries } from '../utils'; | ||
|
|
||
| type Props = { | ||
| type?: string; | ||
| closeModal: () => void; | ||
| }; | ||
|
|
||
| type FinalProps = {} & IRouterProps & Props; | ||
|
|
||
| type State = { | ||
| twitterAccountId: string; | ||
| accountId: string; | ||
| }; | ||
|
|
||
| class GmailContainer extends React.Component<FinalProps, State> { | ||
| constructor(props: FinalProps) { | ||
| super(props); | ||
|
|
||
| this.state = { twitterAccountId: '', accountId: '' }; | ||
| } | ||
|
|
||
| onAccountSelect = (accountId?: string) => { | ||
| if (!accountId) { | ||
| return this.setState({ twitterAccountId: '', accountId: '' }); | ||
| } | ||
|
|
||
| client | ||
| .query({ | ||
| query: gql(queries.fetchApi), | ||
| variables: { | ||
| path: '/twitter/get-account', | ||
| params: { accountId } | ||
| } | ||
| }) | ||
| .then(({ data, loading }: any) => { | ||
| if (!loading) { | ||
| this.setState({ | ||
| twitterAccountId: data.integrationsFetchApi, | ||
| accountId | ||
| }); | ||
| } | ||
| }) | ||
| .catch(error => { | ||
| Alert.error(error.message); | ||
| }); | ||
| }; | ||
|
|
||
| onRemoveAccount = () => { | ||
| this.setState({ twitterAccountId: '' }); | ||
| }; | ||
|
|
||
| renderButton = ({ | ||
| name, | ||
| values, | ||
| isSubmitted, | ||
| callback | ||
| }: IButtonMutateProps) => { | ||
| return ( | ||
| <ButtonMutate | ||
| mutation={mutations.integrationsCreateExternalIntegration} | ||
| variables={values} | ||
| callback={callback} | ||
| refetchQueries={getRefetchQueries('gmail')} | ||
| isSubmitted={isSubmitted} | ||
| type="submit" | ||
| successMessage={`You successfully added a ${name}`} | ||
| /> | ||
| ); | ||
| }; | ||
|
|
||
| render() { | ||
| const { closeModal } = this.props; | ||
| const { accountId, twitterAccountId } = this.state; | ||
|
|
||
| const updatedProps = { | ||
| closeModal, | ||
| accountId, | ||
| twitterAccountId, | ||
| onAccountSelect: this.onAccountSelect, | ||
| onRemoveAccount: this.onRemoveAccount, | ||
| renderButton: this.renderButton | ||
| }; | ||
|
|
||
| return <Twitter {...updatedProps} />; | ||
| } | ||
| } | ||
|
|
||
| export default withRouter<FinalProps>(GmailContainer); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters