Enable threads by default and mark it as a beta feature (#8081)

src/components/structures/ThreadPanel.tsx

@@ -31,7 +31,14 @@ import { Layout } from '../../settings/enums/Layout';
 import { RoomPermalinkCreator } from '../../utils/permalinks/Permalinks';
 import Measured from '../views/elements/Measured';
 import PosthogTrackers from "../../PosthogTrackers";
-import { ButtonEvent } from "../views/elements/AccessibleButton";
+import AccessibleButton, { ButtonEvent } from "../views/elements/AccessibleButton";
+import { BetaPill } from '../views/beta/BetaCard';
+import SdkConfig from '../../SdkConfig';
+import Modal from '../../Modal';
+import BetaFeedbackDialog from '../views/dialogs/BetaFeedbackDialog';
+import { Action } from '../../dispatcher/actions';
+import { UserTab } from '../views/dialogs/UserSettingsDialog';
+import dis from '../../dispatcher/dispatcher';
 
 interface IProps {
     roomId: string;
@@ -233,6 +240,12 @@ const ThreadPanel: React.FC<IProps> = ({
         }
     }, [timelineSet, timelinePanel]);
 
+    const openFeedback = SdkConfig.get().bug_report_endpoint_url ? () => {
+        Modal.createTrackedDialog("Threads Feedback", "feature_thread", BetaFeedbackDialog, {
+            featureId: "feature_thread",
+        });
+    } : null;
+
     return (
         <RoomContext.Provider value={{
             ...roomContext,
@@ -246,6 +259,22 @@ const ThreadPanel: React.FC<IProps> = ({
                     setFilterOption={setFilterOption}
                     empty={threadCount === 0}
                 />}
+                footer={<>
+                    <BetaPill
+                        tooltipTitle={_t("Threads are a beta feature")}
+                        tooltipCaption={_t("Click for more info")}
+                        onClick={() => {
+                            dis.dispatch({
+                                action: Action.ViewUserSettings,
+                                initialTabId: UserTab.Labs,
+                            });
+                        }}
+                    />
+                    { openFeedback && _t("<a>Give feedback</a>", {}, {
+                        a: sub =>
+                            <AccessibleButton kind="link_inline" onClick={openFeedback}>{ sub }</AccessibleButton>,
+                    }) }
+                </>}
                 className="mx_ThreadPanel"
                 onClose={onClose}
                 withoutScrollContainer={true}