@messenger-box/platform-browser 10.0.3-alpha.17 → 10.0.3-alpha.171

package/src/components/post/suggestion/suggestion_box.tsx

@@ -1,5 +0,0 @@
-import * as React from 'react';
-
-export const SuggestionBox = (props) => {
-    return <div>SuggestionBox</div>;
-};

package/src/components/post/textbox/index.ts

@@ -1 +0,0 @@
-export { Textbox } from './textbox';

package/src/components/post/textbox/textbox.tsx

@@ -1,80 +0,0 @@
-import React, { useState, useRef } from 'react';
-import { SuggestionBox } from '../suggestion/suggestion_box';
-
-export const Textbox = (props) => {
-    const [checkMessageLength, setCheckMessageLength] = useState(props.value);
-    const wrapper = useRef();
-    const message = useRef();
-    // let preview = useRef();
-    let preview = null;
-
-    const getInputBox = () => {
-        // return message.current?.getTextbox();
-    };
-
-    let textboxClassName = 'form-control custom-textarea';
-    let textWrapperClass = 'textarea-wrapper';
-    let wrapperHeight;
-    if (props.emojiEnabled) {
-        textboxClassName += ' custom-textarea--emoji-picker';
-    }
-    if (props.badConnection) {
-        textboxClassName += ' bad-connection';
-    }
-    if (wrapper.current) {
-        // wrapperHeight = getInputBox()?.clientHeight;
-    }
-    if (props.preview) {
-        textboxClassName += ' custom-textarea--preview';
-        textWrapperClass += ' textarea-wrapper--preview';
-
-        preview = (
-            <div
-                tabIndex={props.tabIndex || 0}
-                ref={preview}
-                className="form-control custom-textarea textbox-preview-area"
-                onKeyPress={props.onKeyPress}
-                // onKeyDown={handleKeyDown}
-                // onSelect={handleSelect}
-                // onBlur={handleBlur}
-            >
-                {/* <PostMarkdown isRHS={props.isRHS} message={props.value} mentionKeys={[]} channelId={props.channelId} /> */}
-            </div>
-        );
-    }
-    return (
-        <div ref={wrapper} className={textWrapperClass}>
-            <SuggestionBox
-                id={props.id}
-                ref={message}
-                className={textboxClassName}
-                spellCheck="true"
-                placeholder={props.createMessage}
-                // onChange={handleChange}
-                onKeyPress={props.onKeyPress}
-                // onSelect={handleSelect}
-                // onKeyDown={handleKeyDown}
-                // onMouseUp={handleMouseUp}
-                // onKeyUp={handleKeyUp}
-                // onComposition={props.onComposition}
-                // onBlur={handleBlur}
-                // onHeightChange={handleHeightChange}
-                style={{ visibility: props.preview ? 'hidden' : 'visible' }}
-                inputComponent={props.inputComponent}
-                listComponent={props.suggestionList}
-                listPosition={props.suggestionListPosition}
-                // providers={suggestionProviders}
-                channelId={props.channelId}
-                value={props.value}
-                renderDividers={true}
-                isRHS={props.isRHS}
-                disabled={props.disabled}
-                contextId={props.channelId}
-                listenForMentionKeyClick={props.listenForMentionKeyClick}
-                wrapperHeight={wrapperHeight}
-                openWhenEmpty={props.openWhenEmpty}
-            />
-            {preview}
-        </div>
-    );
-};

package/src/components/post/textbox/textbox_links/index.ts

@@ -1,24 +0,0 @@
-// // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// // See LICENSE.txt for license information.
-
-// import {connect} from 'react-redux';
-
-// import {GlobalState} from 'types/store';
-
-// import {getCurrentLocale} from 'selectors/i18n';
-
-// import Constants from 'utils/constants';
-// import {isFeatureEnabled} from 'utils/utils';
-
-// import TextboxLinks from './textbox_links';
-
-// const PreReleaseFeatures = Constants.PRE_RELEASE_FEATURES;
-
-// const mapStateToProps = (state: GlobalState) => {
-//     return ({
-//         isMarkdownPreviewEnabled: isFeatureEnabled(PreReleaseFeatures.MARKDOWN_PREVIEW, state),
-//         currentLocale: getCurrentLocale(state),
-//     });
-// };
-
-// export default connect(mapStateToProps)(TextboxLinks);

package/src/components/post/textbox/textbox_links/textbox_links.tsx

@@ -1,143 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import React, {MouseEvent} from 'react';
-import {FormattedMessage} from 'react-intl';
-import {Link} from '@remix-run/react';
-
-type Props = {
-    showPreview?: boolean;
-    characterLimit: number;
-    previewMessageLink?: string;
-    updatePreview?: (showPreview: boolean) => void;
-    message?: string;
-    isMarkdownPreviewEnabled: boolean;
-    currentLocale: string;
-};
-
-const TextboxLinks: React.FC<Props> = ({
-    showPreview,
-    characterLimit,
-    previewMessageLink,
-    updatePreview,
-    message = '',
-    isMarkdownPreviewEnabled,
-    currentLocale,
-}: Props) => {
-    const togglePreview = (e: MouseEvent) => {
-        e.preventDefault();
-        updatePreview?.(!showPreview);
-    };
-
-    const hasText = message && message.length > 0;
-    let editHeader;
-
-    let helpTextClass = '';
-
-    if (message && message.length > characterLimit) {
-        helpTextClass = 'hidden';
-    }
-
-    if (previewMessageLink) {
-        editHeader = (
-            <span>
-                {previewMessageLink}
-            </span>
-        );
-    } else {
-        editHeader = (
-            <FormattedMessage
-                id='textbox.edit'
-                defaultMessage='Edit message'
-            />
-        );
-    }
-
-    let previewLink = null;
-    if (isMarkdownPreviewEnabled) {
-        previewLink = (
-            <button
-                id='previewLink'
-                onClick={togglePreview}
-                className='style--none textbox-preview-link color--link'
-            >
-                {showPreview ? (
-                    editHeader
-                ) : (
-                    <FormattedMessage
-                        id='textbox.preview'
-                        defaultMessage='Preview'
-                    />
-                )}
-            </button>
-        );
-    }
-
-    const helpText = (
-        <div
-            style={{visibility: hasText ? 'visible' : 'hidden', opacity: hasText ? '0.45' : '0'}}
-            className='help__format-text'
-        >
-            <b>
-                <FormattedMessage
-                    id='textbox.bold'
-                    defaultMessage='**bold**'
-                />
-            </b>
-            <i>
-                <FormattedMessage
-                    id='textbox.italic'
-                    defaultMessage='*italic*'
-                />
-            </i>
-            <span>
-                {'~~'}
-                <s>
-                    <FormattedMessage
-                        id='textbox.strike'
-                        defaultMessage='strike'
-                    />
-                </s>
-                {'~~ '}
-            </span>
-            <span>
-                <FormattedMessage
-                    id='textbox.inlinecode'
-                    defaultMessage='`inline code`'
-                />
-            </span>
-            <span>
-                <FormattedMessage
-                    id='textbox.preformatted'
-                    defaultMessage='```preformatted```'
-                />
-            </span>
-            <span>
-                <FormattedMessage
-                    id='textbox.quote'
-                    defaultMessage='>quote'
-                />
-            </span>
-        </div>
-    );
-
-    return (
-        <div className={'help__text ' + helpTextClass}>
-            {helpText}
-            {previewLink}
-            <Link
-                target='_blank'
-                rel='noopener noreferrer'
-                to={`/help/messaging?locale=${currentLocale}`}
-                className='textbox-help-link'
-            >
-                <FormattedMessage
-                    id='textbox.help'
-                    defaultMessage='Help'
-                />
-            </Link>
-        </div>
-    );
-};
-
-export default TextboxLinks;

package/src/components/post/threading/channel_threads/thread_footer/index.ts

@@ -1,4 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-export { ThreadFooter } from './thread_footer';

package/src/components/post/threading/channel_threads/thread_footer/thread_footer.scss

@@ -1,72 +0,0 @@
-.ThreadFooter {
-    --button-separator-height: 15px;
-    --button-separator-gap: 4px;
-
-    position: relative;
-    left: -34px;
-    display: inline-flex;
-    width: calc(100% + 15px);
-    align-items: center;
-    padding: 0 0 5px 10px;
-    margin-top: 1px;
-    margin-bottom: 5px;
-    color: rgba(var(--center-channel-color-rgb), 0.64);
-    font-size: 12px;
-    line-height: 15px;
-    white-space: nowrap;
-
-    .indicator {
-        width: 24px;
-        height: 24px;
-        padding: 8px;
-    }
-
-    .dot-unreads {
-        width: 8px;
-        height: 8px;
-        background: rgba(var(--sidebar-text-active-border-rgb), 1);
-        border-radius: 50%;
-    }
-
-    .Avatars {
-        margin-right: 4px;
-        font-weight: 600;
-    }
-
-    .icon {
-        width: 14px;
-        height: 13px;
-        font-size: 14px;
-    }
-
-    .alt-visible {
-        opacity: 0;
-    }
-
-    &:hover,
-    &:focus-within,
-    &.is-active,
-    .post:hover &,
-    .post:focus-within & {
-        .alt-visible {
-            opacity: 1;
-        }
-
-        .alt-hidden {
-            display: none;
-        }
-    }
-
-    .Timestamp {
-        display: inline-grid;
-        padding-left: 1rem;
-        font-weight: 400;
-
-        > span {
-            display: inline-block;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-        }
-    }
-}

package/src/components/post/threading/channel_threads/thread_footer/thread_footer.tsx

@@ -1,206 +0,0 @@
-import React, { memo, useCallback, useEffect, useMemo } from 'react';
-import { FormattedMessage } from 'react-intl';
-import Button from '../../common/button';
-import FollowButton from '../../common/follow_button';
-import Avatars from '../../../../../widgets/users/avatars';
-import SimpleTooltip from '../../../../../widgets/simple_tooltip';
-// import Timestamp from '../../../timestamp';
-
-export const ThreadFooter = (props) => {
-    const baseState = {
-        entities: {
-            general: {
-                config: {},
-            },
-            users: {
-                currentUserId: 'uid',
-                profiles: {
-                    1: {
-                        id: '1',
-                        username: 'first.last1',
-                        nickname: 'nickname1',
-                        first_name: 'First1',
-                        last_name: 'Last1',
-                    },
-                    2: {
-                        id: '2',
-                        username: 'first.last2',
-                        nickname: 'nickname2',
-                        first_name: 'First2',
-                        last_name: 'Last2',
-                    },
-                    3: {
-                        id: '3',
-                        username: 'first.last3',
-                        nickname: 'nickname3',
-                        first_name: 'First3',
-                        last_name: 'Last3',
-                    },
-                    4: {
-                        id: '4',
-                        username: 'first.last4',
-                        nickname: 'nickname4',
-                        first_name: 'First4',
-                        last_name: 'Last4',
-                    },
-                    5: {
-                        id: '5',
-                        username: 'first.last5',
-                        nickname: 'nickname5',
-                        first_name: 'First5',
-                        last_name: 'Last5',
-                    },
-                },
-            },
-
-            teams: {
-                currentTeamId: 'tid',
-            },
-            preferences: {
-                myPreferences: {},
-            },
-            posts: {
-                posts: {
-                    postthreadid: {
-                        id: 'postthreadid',
-                        reply_count: 9,
-                        last_reply_at: 1554161504000,
-                        is_following: true,
-                        channel_id: 'cid',
-                        user_id: '1',
-                    },
-                    singlemessageid: {
-                        id: 'singlemessageid',
-                        reply_count: 0,
-                        last_reply_at: 0,
-                        is_following: true,
-                        channel_id: 'cid',
-                        user_id: '1',
-                    },
-                },
-            },
-
-            threads: {
-                threads: {
-                    postthreadid: {
-                        id: 'postthreadid',
-                        participants: [{ id: '1' }, { id: '2' }, { id: '3' }, { id: '4' }, { id: '5' }],
-                        reply_count: 9,
-                        unread_replies: 0,
-                        unread_mentions: 0,
-                        last_reply_at: 1554161504000,
-                        last_viewed_at: 1554161505000,
-                        is_following: true,
-                        post: {
-                            channel_id: 'cid',
-                            user_id: '1',
-                        },
-                    },
-                },
-            },
-        },
-    };
-    // const dispatch = useDispatch();
-    // const currentTeamId = useSelector(getCurrentTeamId);
-    // const currentUserId = useSelector(getCurrentUserId);
-    // const post = useSelector((state: GlobalState) => getPost(state, threadId));
-    // const thread = useSelector((state: GlobalState) => getThreadOrSynthetic(state, post));
-
-    // useEffect(() => {
-    //     if (threadIsSynthetic(thread) && thread.is_following && thread.reply_count > 0) {
-    //         dispatch(fetchThread(currentUserId, currentTeamId, threadId));
-    //     }
-    // }, []);
-
-    const {
-        participants,
-        reply_count: totalReplies = 0,
-        last_reply_at: lastReplyAt,
-        is_following: isFollowing = false,
-        post: { channel_id: channelId },
-    } = baseState.entities.threads.threads.postthreadid;
-
-    const participantIds = useMemo(() => participants?.map(({ id }) => id).reverse(), [participants]);
-
-    // const handleReply = useCallback(
-    //     (e) => {
-    //         e.stopPropagation();
-    //         dispatch(selectPost({ id: threadId, channel_id: channelId } as any));
-    //     },
-    //     [threadId, channelId],
-    // );
-
-    // const handleFollowing = useCallback(
-    //     (e) => {
-    //         e.stopPropagation();
-    //         dispatch(setThreadFollow(currentUserId, currentTeamId, threadId, !isFollowing));
-    //     },
-    //     [isFollowing],
-    // );
-    const handleReply = () => {
-        console.log('here is');
-    };
-    return (
-        <div className="ThreadFooter">
-            {!isFollowing || !baseState.entities.threads.threads.postthreadid.unread_replies ? (
-                <div className="indicator" />
-            ) : (
-                <SimpleTooltip
-                    id="threadFooterIndicator"
-                    content={
-                        <FormattedMessage
-                            id="threading.numNewMessages"
-                            defaultMessage="{newReplies, plural, =0 {no unread messages} =1 {one unread message} other {# unread messages}}"
-                            values={{ newReplies: baseState.entities.threads.threads.postthreadid.unread_replies }}
-                        />
-                    }
-                >
-                    <div className="indicator" tabIndex={0}>
-                        <div className="dot-unreads" />
-                    </div>
-                </SimpleTooltip>
-            )}
-
-            {participantIds ? <Avatars userIds={participantIds} size="sm" /> : null}
-
-            {baseState.entities.threads.threads.postthreadid.unread_replies > 0 && (
-                <Button
-                    onClick={handleReply}
-                    className="ReplyButton separated"
-                    prepend={
-                        <span className="icon">
-                            <i className="icon-reply-outline" />
-                        </span>
-                    }
-                >
-                    <FormattedMessage
-                        id="threading.numReplies"
-                        defaultMessage="{totalReplies, plural, =0 {Reply} =1 {# reply} other {# replies}}"
-                        values={{ totalReplies }}
-                    />
-                </Button>
-            )}
-
-            <FollowButton
-                isFollowing={isFollowing}
-                className="separated"
-                // onClick={handleFollowing}
-            />
-
-            {Boolean(lastReplyAt) && (
-                <h1>here is </h1>
-                // <Timestamp value={lastReplyAt} {...THREADING_TIME}>
-                //     {({ formatted }) => (
-                //         <span className="Timestamp separated alt-visible">
-                //             <FormattedMessage
-                //                 id="threading.footer.lastReplyAt"
-                //                 defaultMessage="Last reply {formatted}"
-                //                 values={{ formatted }}
-                //             />
-                //         </span>
-                //     )}
-                // </Timestamp>
-            )}
-        </div>
-    );
-};

package/src/components/post/threading/common/button/__snapshots__/button.test.tsx.snap

@@ -1,68 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`components/threading/common/button should support appended content 1`] = `
-<button
-  className="Button Button___transparent"
->
-  <span
-    className="Button_label"
-  />
-  <span
-    className="Button_appended"
-  >
-    <ReplyIcon
-      className="Icon"
-    />
-  </span>
-</button>
-`;
-
-exports[`components/threading/common/button should support children 1`] = `
-<button
-  className="Button Button___transparent"
->
-  <span
-    className="Button_label"
-  >
-    text-goes-here
-  </span>
-</button>
-`;
-
-exports[`components/threading/common/button should support className 1`] = `
-<button
-  className="Button Button___transparent test-class other-test-class"
->
-  <span
-    className="Button_label"
-  />
-</button>
-`;
-
-exports[`components/threading/common/button should support onClick 1`] = `
-<button
-  className="Button Button___transparent"
-  onClick={[MockFunction]}
->
-  <span
-    className="Button_label"
-  />
-</button>
-`;
-
-exports[`components/threading/common/button should support prepended content 1`] = `
-<button
-  className="Button Button___transparent"
->
-  <span
-    className="Button_prepended"
-  >
-    <ReplyIcon
-      className="Icon"
-    />
-  </span>
-  <span
-    className="Button_label"
-  />
-</button>
-`;