Replace typography components with Compound components
This commit is contained in:
@@ -8,12 +8,11 @@ Please see LICENSE in the repository root for full details.
|
||||
import { FC, useCallback } from "react";
|
||||
import { randomString } from "matrix-js-sdk/src/randomstring";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Button } from "@vector-im/compound-web";
|
||||
import { Button, Text } from "@vector-im/compound-web";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
|
||||
import { FieldRow, InputField, ErrorMessage } from "../input/Input";
|
||||
import { useSubmitRageshake, useRageshakeRequest } from "./submit-rageshake";
|
||||
import { Body } from "../typography/Typography";
|
||||
import feedbackStyles from "../input/FeedbackInput.module.css";
|
||||
|
||||
interface Props {
|
||||
@@ -56,7 +55,7 @@ export const FeedbackSettingsTab: FC<Props> = ({ roomId }) => {
|
||||
return (
|
||||
<div>
|
||||
<h4>{t("settings.feedback_tab_h4")}</h4>
|
||||
<Body>{t("settings.feedback_tab_body")}</Body>
|
||||
<Text>{t("settings.feedback_tab_body")}</Text>
|
||||
<form onSubmit={onSubmitFeedback}>
|
||||
<FieldRow>
|
||||
<InputField
|
||||
@@ -85,7 +84,7 @@ export const FeedbackSettingsTab: FC<Props> = ({ roomId }) => {
|
||||
)}
|
||||
<FieldRow>
|
||||
{error && <ErrorMessage error={error} />}
|
||||
{sent && <Body> {t("settings.feedback_tab_thank_you")}</Body>}
|
||||
{sent && <Text>{t("settings.feedback_tab_thank_you")}</Text>}
|
||||
</FieldRow>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@@ -8,13 +8,12 @@ Please see LICENSE in the repository root for full details.
|
||||
import { ChangeEvent, FC, ReactNode, useCallback } from "react";
|
||||
import { Trans, useTranslation } from "react-i18next";
|
||||
import { MatrixClient } from "matrix-js-sdk/src/matrix";
|
||||
import { Dropdown } from "@vector-im/compound-web";
|
||||
import { Dropdown, Text } from "@vector-im/compound-web";
|
||||
|
||||
import { Modal } from "../Modal";
|
||||
import styles from "./SettingsModal.module.css";
|
||||
import { Tab, TabContainer } from "../tabs/Tabs";
|
||||
import { FieldRow, InputField } from "../input/Input";
|
||||
import { Caption } from "../typography/Typography";
|
||||
import { AnalyticsNotice } from "../analytics/AnalyticsNotice";
|
||||
import { ProfileSettingsTab } from "./ProfileSettingsTab";
|
||||
import { FeedbackSettingsTab } from "./FeedbackSettingsTab";
|
||||
@@ -102,14 +101,14 @@ export const SettingsModal: FC<Props> = ({
|
||||
};
|
||||
|
||||
const optInDescription = (
|
||||
<Caption>
|
||||
<Text size="sm">
|
||||
<Trans i18nKey="settings.opt_in_description">
|
||||
<AnalyticsNotice />
|
||||
<br />
|
||||
You may withdraw consent by unchecking this box. If you are currently in
|
||||
a call, this setting will take effect at the end of the call.
|
||||
</Trans>
|
||||
</Caption>
|
||||
</Text>
|
||||
);
|
||||
|
||||
const devices = useMediaDevices();
|
||||
|
||||
Reference in New Issue
Block a user