fix: add missing Flow type definition files

Author: devin-ai-integration[bot]

src/elements/content-sidebar/activity-feed/common/activity-error/index.js.flow

@@ -0,0 +1,36 @@
+// @flow
+import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+import type { MessageDescriptor } from 'react-intl';
+import classnames from 'classnames';
+import InlineError from '../../../../../components/inline-error';
+import PlainButton from '../../../../../components/plain-button';
+import './ActivityError.scss';
+
+type Props = {
+    action?: {
+        onAction: Function,
+        text: string,
+    },
+    className?: string,
+    message: MessageDescriptor,
+    title: MessageDescriptor,
+};
+
+const ActivityError = ({ action, message, title, className, ...rest }: Props): React.Node => (
+    <InlineError
+        className={classnames('bcs-ActivityError', className)}
+        title={<FormattedMessage {...title} {...rest} />}
+    >
+        <div>
+            <FormattedMessage {...message} />
+        </div>
+        {action ? (
+            <PlainButton className="bcs-ActivityError-action lnk" onClick={action.onAction} type="button">
+                {action.text}
+            </PlainButton>
+        ) : null}
+    </InlineError>
+);
+
+export default ActivityError;

src/elements/content-sidebar/activity-feed/common/activity-message/index.js.flow

@@ -0,0 +1,124 @@
+// @flow
+import * as React from 'react';
+import noop from 'lodash/noop';
+import { FormattedMessage } from 'react-intl';
+import CollapsableMessage from './CollapsableMessage';
+import formatTaggedMessage from '../../utils/formatTaggedMessage';
+import LoadingIndicator from '../../../../../components/loading-indicator';
+import messages from './messages';
+import ShowOriginalButton from './ShowOriginalButton';
+import TranslateButton from './TranslateButton';
+import { withFeatureConsumer, isFeatureEnabled } from '../../../../common/feature-checking';
+
+import type { GetProfileUrlCallback } from '../../../../common/flowTypes';
+import type { FeatureConfig } from '../../../../common/feature-checking';
+
+import './ActivityMessage.scss';
+
+type Props = {
+    features: FeatureConfig,
+    getUserProfileUrl?: GetProfileUrlCallback,
+    id: string,
+    isEdited?: boolean,
+    onTranslate?: Function,
+    tagged_message: string,
+    translatedTaggedMessage?: string,
+    translationEnabled?: boolean,
+    translationFailed?: ?boolean,
+};
+
+type State = {
+    isLoading?: boolean,
+    isTranslation?: boolean,
+};
+
+class ActivityMessage extends React.Component<Props, State> {
+    static defaultProps = {
+        isEdited: false,
+        translationEnabled: false,
+    };
+
+    state = {
+        isLoading: false,
+        isTranslation: false,
+    };
+
+    componentDidUpdate(prevProps: Props): void {
+        const { translatedTaggedMessage, translationFailed } = this.props;
+        const { translatedTaggedMessage: prevTaggedMessage, translationFailed: prevTranslationFailed } = prevProps;
+
+        if (prevTaggedMessage === translatedTaggedMessage || prevTranslationFailed === translationFailed) {
+            return;
+        }
+
+        if (translatedTaggedMessage || translationFailed) {
+            this.setState({ isLoading: false });
+        }
+    }
+
+    getButton(isTranslation?: boolean): React.Node {
+        let button = null;
+        if (isTranslation) {
+            button = <ShowOriginalButton handleShowOriginal={this.handleShowOriginal} />;
+        } else {
+            button = <TranslateButton handleTranslate={this.handleTranslate} />;
+        }
+
+        return button;
+    }
+
+    handleTranslate = (event: SyntheticMouseEvent<>): void => {
+        const { id, tagged_message, onTranslate = noop, translatedTaggedMessage } = this.props;
+        if (!translatedTaggedMessage) {
+            this.setState({ isLoading: true });
+            onTranslate({ id, tagged_message });
+        }
+
+        this.setState({ isTranslation: true });
+        event.preventDefault();
+    };
+
+    handleShowOriginal = (event: SyntheticMouseEvent<>): void => {
+        this.setState({ isTranslation: false });
+        event.preventDefault();
+    };
+
+    render(): React.Node {
+        const {
+            features,
+            getUserProfileUrl,
+            id,
+            isEdited,
+            tagged_message,
+            translatedTaggedMessage,
+            translationEnabled,
+        } = this.props;
+        const { isLoading, isTranslation } = this.state;
+        const commentToDisplay =
+            translationEnabled && isTranslation && translatedTaggedMessage ? translatedTaggedMessage : tagged_message;
+        const MessageWrapper = isFeatureEnabled(features, 'activityFeed.collapsableMessages.enabled')
+            ? CollapsableMessage
+            : React.Fragment;
+
+        return isLoading ? (
+            <div className="bcs-ActivityMessageLoading">
+                <LoadingIndicator size="small" />
+            </div>
+        ) : (
+            <div className="bcs-ActivityMessage">
+                <MessageWrapper>
+                    {formatTaggedMessage(commentToDisplay, id, false, getUserProfileUrl)}
+                    {isEdited && (
+                        <span className="bcs-ActivityMessage-edited">
+                            <FormattedMessage {...messages.activityMessageEdited} />
+                        </span>
+                    )}
+                </MessageWrapper>
+                {translationEnabled ? this.getButton(isTranslation) : null}
+            </div>
+        );
+    }
+}
+
+export { ActivityMessage };
+export default withFeatureConsumer(ActivityMessage);

src/elements/content-sidebar/activity-feed/common/activity-status/index.js.flow

@@ -0,0 +1,30 @@
+// @flow
+import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+import LabelPill from '../../../../../components/label-pill';
+import { COMMENT_STATUS_RESOLVED } from '../../../../../constants';
+import messages from './messages';
+import type { FeedItemStatus } from '../../../../../common/types/feed';
+import './ActivityStatus.scss';
+
+type Props = {
+    status?: FeedItemStatus,
+};
+
+const ActivityStatus = ({ status }: Props): React.Node => {
+    if (status !== COMMENT_STATUS_RESOLVED) {
+        return null;
+    }
+
+    return (
+        <div className="bcs-ActivityStatus" data-testid="bcs-ActivityStatus">
+            <LabelPill.Pill type="success">
+                <LabelPill.Text>
+                    <FormattedMessage {...messages.activityStatusResolved} />
+                </LabelPill.Text>
+            </LabelPill.Pill>
+        </div>
+    );
+};
+
+export default ActivityStatus;

src/elements/content-sidebar/activity-feed/common/activity-timestamp/index.js.flow

@@ -0,0 +1,21 @@
+// @flow
+import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+import ActivityDatestamp from '../activity-datestamp';
+import Tooltip from '../../../../../components/tooltip';
+import messages from './messages';
+import './ActivityTimestamp.scss';
+
+type Props = {
+    date: number, // unix epoch timestamp (new Date().getTime())
+};
+
+const ActivityTimestamp = ({ date }: Props) => (
+    <Tooltip text={<FormattedMessage {...messages.fullDateTime} values={{ time: date }} />}>
+        <small className="bcs-ActivityTimestamp">
+            <ActivityDatestamp date={date} />
+        </small>
+    </Tooltip>
+);
+
+export default ActivityTimestamp;

src/elements/content-sidebar/activity-feed/common/delete-confirmation/index.js.flow

@@ -0,0 +1,84 @@
+/**
+ * @flow
+ * @file Comment component
+ */
+
+import * as React from 'react';
+import { FormattedMessage, type MessageDescriptor } from 'react-intl';
+
+import Button from '../../../../../components/button';
+import commonMessages from '../../../../common/messages';
+import PrimaryButton from '../../../../../components/primary-button';
+import { KEYS } from '../../../../../constants';
+import { Overlay } from '../../../../../components/flyout';
+import { ACTIVITY_TARGETS } from '../../../../common/interactionTargets';
+import './DeleteConfirmation.scss';
+
+type Props = {
+    isOpen: boolean,
+    message: MessageDescriptor,
+    onDeleteCancel: Function,
+    onDeleteConfirm: Function,
+};
+
+class DeleteConfirmation extends React.Component<Props> {
+    onKeyDown = (event: SyntheticKeyboardEvent<>): void => {
+        const { nativeEvent } = event;
+        const { isOpen, onDeleteCancel } = this.props;
+
+        nativeEvent.stopImmediatePropagation();
+
+        switch (event.key) {
+            case KEYS.escape:
+                event.stopPropagation();
+                event.preventDefault();
+                if (isOpen) {
+                    onDeleteCancel();
+                }
+                break;
+            default:
+                break;
+        }
+    };
+
+    render() {
+        const { isOpen, message, onDeleteCancel, onDeleteConfirm, ...rest } = this.props;
+
+        return (
+            <Overlay
+                className="be-modal bcs-DeleteConfirmation"
+                onKeyDown={this.onKeyDown}
+                role="dialog"
+                shouldDefaultFocus
+                shouldOutlineFocus={false}
+                {...rest}
+            >
+                <div className="bcs-DeleteConfirmation-promptMessage">
+                    <FormattedMessage {...message} />
+                </div>
+                <div>
+                    <Button
+                        aria-label={commonMessages.cancel.defaultMessage}
+                        className="bcs-DeleteConfirmation-cancel"
+                        onClick={onDeleteCancel}
+                        type="button"
+                        data-resin-target={ACTIVITY_TARGETS.INLINE_DELETE_CANCEL}
+                    >
+                        <FormattedMessage {...commonMessages.cancel} />
+                    </Button>
+                    <PrimaryButton
+                        aria-label={commonMessages.delete.defaultMessage}
+                        className="bcs-DeleteConfirmation-delete"
+                        onClick={onDeleteConfirm}
+                        type="button"
+                        data-resin-target={ACTIVITY_TARGETS.INLINE_DELETE_CONFIRM}
+                    >
+                        <FormattedMessage {...commonMessages.delete} />
+                    </PrimaryButton>
+                </div>
+            </Overlay>
+        );
+    }
+}
+
+export default DeleteConfirmation;

src/elements/content-sidebar/activity-feed/common/user-link/index.js.flow

@@ -0,0 +1,65 @@
+// @flow
+import * as React from 'react';
+import classnames from 'classnames';
+import { Link } from '../../../../../components/link';
+import type { GetProfileUrlCallback } from '../../../../common/flowTypes';
+import './UserLink.scss';
+
+type Props = {
+    className?: string,
+    getUserProfileUrl?: GetProfileUrlCallback,
+    id: string,
+    name: string,
+};
+
+type State = {
+    profileUrl?: string,
+};
+
+class UserLink extends React.PureComponent<Props, State> {
+    state = {};
+
+    /**
+     * Success handler for getting profile url
+     *
+     * @param {string} profileUrl the user profile url
+     */
+    getProfileUrlHandler = (profileUrl?: string) => {
+        this.setState({
+            profileUrl,
+        });
+    };
+
+    /**
+     * Gets the profile URL for the user from the getUserProfileUrl prop
+     *
+     * @return {Promise} a promise which resolves with the profileUrl string
+     */
+    getUserProfileUrl() {
+        const { id, getUserProfileUrl }: Props = this.props;
+        if (!getUserProfileUrl) {
+            return Promise.resolve();
+        }
+
+        return getUserProfileUrl(id).then(this.getProfileUrlHandler);
+    }
+
+    componentDidMount() {
+        this.getUserProfileUrl();
+    }
+
+    render() {
+        const { name, getUserProfileUrl, className, ...rest }: Props = this.props;
+        const { profileUrl }: State = this.state;
+
+        return profileUrl ? (
+            <Link className={classnames('bcs-UserLink', className)} {...rest} href={profileUrl}>
+                {name}
+            </Link>
+        ) : (
+            <span {...rest}>{name}</span>
+        );
+    }
+}
+
+export default UserLink;