Enable rageshake on PTT mode

By putting another 'Submit Feedback' button in the developer section
of the setting modal (we can work out a better place for it).

src/room/PTTCallView.tsx

@@ -37,6 +37,8 @@ import { getAvatarUrl } from "../matrix-utils";
 import { ReactComponent as AudioIcon } from "../icons/Audio.svg";
 import { usePTTSounds } from "../sound/usePttSounds";
 import { PTTClips } from "../sound/PTTClips";
+import { GroupCallInspector } from "./GroupCallInspector";
+import { FeedbackModal } from "./FeedbackModal";
 
 function getPromptText(
   showTalkOverError: boolean,
@@ -102,6 +104,8 @@ export const PTTCallView: React.FC<Props> = ({
     useModalTriggerState();
   const { modalState: settingsModalState, modalProps: settingsModalProps } =
     useModalTriggerState();
+  const { modalState: feedbackModalState, modalProps: feedbackModalProps } =
+    useModalTriggerState();
   const [containerRef, bounds] = useMeasure({ polyfill: ResizeObserver });
   const facepileSize = bounds.width < 800 ? "sm" : "md";
   const pttButtonSize = 232;
@@ -148,6 +152,13 @@ export const PTTCallView: React.FC<Props> = ({
         startTalkingRemoteRef={startTalkingRemoteRef}
         blockedRef={blockedRef}
       />
+      <GroupCallInspector
+        client={client}
+        groupCall={groupCall}
+        // Never shown in PTT mode, but must be present to collect call state
+        // https://github.com/vector-im/element-call/issues/328
+        show={false}
+      />
       <Header className={styles.header}>
         <LeftNav>
           <RoomSetupHeaderInfo roomName={roomName} onPress={onLeave} />
@@ -232,6 +243,14 @@ export const PTTCallView: React.FC<Props> = ({
           {...settingsModalProps}
           setShowInspector={setShowInspector}
           showInspector={showInspector}
+          showFeedbackDialog={feedbackModalState.open}
+        />
+      )}
+      {feedbackModalState.isOpen && (
+        <FeedbackModal
+          {...feedbackModalProps}
+          roomId={groupCall?.room.roomId}
+          inCall
         />
       )}
       {inviteModalState.isOpen && (

src/settings/SettingsModal.jsx

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React from "react";
+import React, { useCallback } from "react";
 import { Modal } from "../Modal";
 import styles from "./SettingsModal.module.css";
 import { TabContainer, TabItem } from "../tabs/Tabs";
@@ -29,7 +29,12 @@ import { Button } from "../button";
 import { useDownloadDebugLog } from "./submit-rageshake";
 import { Body } from "../typography/Typography";
 
-export function SettingsModal({ setShowInspector, showInspector, ...rest }) {
+export function SettingsModal({
+  setShowInspector,
+  showInspector,
+  showFeedbackDialog,
+  ...rest
+}) {
   const {
     audioInput,
     audioInputs,
@@ -125,6 +130,7 @@ export function SettingsModal({ setShowInspector, showInspector, ...rest }) {
           </FieldRow>
           <FieldRow>
             <Button onPress={downloadDebugLog}>Download Debug Logs</Button>
+            <Button onPress={showFeedbackDialog}>Submit Feedback</Button>
           </FieldRow>
         </TabItem>
       </TabContainer>