snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/components/CreateDiscussion/CreateDiscussion.spec.tsx

@@ -0,0 +1,97 @@
+import { mockAppRoot } from '@rocket.chat/mock-providers';
+import { composeStories } from '@storybook/react';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { axe } from 'jest-axe';
+
+import CreateDiscussion from './CreateDiscussion';
+import * as stories from './CreateDiscussion.stories';
+import { createFakeRoom } from '../../../tests/mocks/data';
+
+jest.mock('../../lib/rooms/roomCoordinator', () => ({
+	roomCoordinator: {
+		getRoomDirectives: () => ({
+			getRoomName: () => 'General',
+		}),
+	},
+}));
+
+const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
+
+const room1 = createFakeRoom({ encrypted: true, fname: 'Encrypted Room 1' });
+const room2 = createFakeRoom({ encrypted: false, fname: 'Unencrypted Room 2' });
+
+const appRoot = mockAppRoot()
+	.withEndpoint('POST', '/v1/rooms.createDiscussion', () => ({
+		success: true,
+		discussion: {
+			...createFakeRoom({
+				_id: 'discussion-id',
+				t: 'p' as const,
+				name: 'discussion-name',
+				fname: 'Discussion Name',
+				prid: 'parent-room-id',
+			}),
+			rid: 'discussion-id',
+		} as any,
+	}))
+	.withEndpoint(
+		'GET',
+		'/v1/rooms.autocomplete.channelAndPrivate',
+		() =>
+			({
+				items: [room1, room2],
+			}) as any,
+	)
+	.withTranslations('en', 'core', {
+		Encrypted: 'Encrypted',
+		Discussion_first_message_title: 'Message',
+		Discussion_target_channel: 'Parent channel or team',
+	})
+	.build();
+
+describe('CreateDiscussion', () => {
+	test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
+		const { baseElement } = render(<Story />, { wrapper: appRoot });
+		expect(baseElement).toMatchSnapshot();
+	});
+
+	test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
+		const { container } = render(<Story />, { wrapper: appRoot });
+
+		const results = await axe(container);
+		expect(results).toHaveNoViolations();
+	});
+
+	describe('Encrypted parent room behavior', () => {
+		it('should disable encrypted toggle and first message field when parent room is encrypted', () => {
+			render(<CreateDiscussion onClose={jest.fn()} encryptedParentRoom={true} />, { wrapper: appRoot });
+
+			const encryptedToggle = screen.getByRole('checkbox', { name: 'Encrypted' });
+			expect(encryptedToggle).toBeDisabled();
+
+			const firstMessageField = screen.getByLabelText('Message');
+			expect(firstMessageField).toBeDisabled();
+		});
+
+		it('should disable encrypted toggle and first message field when an encrypted parent room is selected', async () => {
+			render(<CreateDiscussion onClose={jest.fn()} />, { wrapper: appRoot });
+
+			const parentRoomSelect = screen.getByRole('textbox', { name: 'Parent channel or team' });
+
+			await userEvent.click(parentRoomSelect);
+
+			await waitFor(() => {
+				expect(screen.getByText('Encrypted Room 1')).toBeInTheDocument();
+			});
+
+			await userEvent.click(screen.getByText('Encrypted Room 1'));
+
+			const encryptedToggle = screen.getByRole('checkbox', { name: 'Encrypted' });
+			expect(encryptedToggle).toBeDisabled();
+
+			const firstMessageField = screen.getByLabelText('Message');
+			expect(firstMessageField).toBeDisabled();
+		});
+	});
+});

apps/meteor/client/components/CreateDiscussion/CreateDiscussion.stories.tsx

@@ -0,0 +1,16 @@
+import type { StoryObj, Meta } from '@storybook/react';
+
+import CreateDiscussion from './CreateDiscussion';
+
+export default {
+	component: CreateDiscussion,
+	parameters: {
+		layout: 'fullscreen',
+		actions: { argTypesRegex: '^on.*' },
+	},
+	args: {
+		onClose: () => undefined,
+	},
+} satisfies Meta<typeof CreateDiscussion>;
+
+export const Default: StoryObj<typeof CreateDiscussion> = {};

apps/meteor/client/components/CreateDiscussion/CreateDiscussion.tsx

@@ -0,0 +1,222 @@
+import type { IMessage, IRoom, IUser } from '@rocket.chat/core-typings';
+import { Icon, Box } from '@rocket.chat/fuselage';
+import {
+	Field,
+	FieldGroup,
+	ToggleSwitch,
+	TextInput,
+	TextAreaInput,
+	FieldHint,
+	FieldLabel,
+	FieldRow,
+	FieldError,
+} from '@rocket.chat/fuselage-forms';
+import { useStableCallback } from '@rocket.chat/fuselage-hooks';
+import { GenericModal } from '@rocket.chat/ui-client';
+import { useTranslation, useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts';
+import { useMutation } from '@tanstack/react-query';
+import { useState } from 'react';
+import { useForm, Controller } from 'react-hook-form';
+
+import { useEncryptedRoomDescription } from '../../navbar/NavBarPagesGroup/actions/useEncryptedRoomDescription';
+import { useGoToRoom } from '../../views/room/hooks/useGoToRoom';
+import RoomAutoComplete from '../RoomAutoComplete';
+import UserAutoCompleteMultiple from '../UserAutoCompleteMultiple';
+import DefaultParentRoomField from './DefaultParentRoomField';
+
+type CreateDiscussionFormValues = {
+	name: string;
+	parentRoom: IRoom['_id'];
+	encrypted: boolean;
+	usernames: Array<IUser['username']>;
+	firstMessage: string;
+	topic: string;
+};
+
+export type CreateDiscussionProps = {
+	parentMessageId?: IMessage['_id'];
+	encryptedParentRoom?: boolean;
+	onClose: () => void;
+	onSuccess?: (rid: string) => void | Promise<void>;
+	defaultParentRoom?: IRoom['_id'];
+	nameSuggestion?: string;
+};
+
+const CreateDiscussion = ({
+	onClose,
+	onSuccess,
+	defaultParentRoom,
+	parentMessageId,
+	nameSuggestion,
+	encryptedParentRoom = false,
+}: CreateDiscussionProps) => {
+	const t = useTranslation();
+
+	const [encryptedDisabled, setEncryptedDisabled] = useState(encryptedParentRoom);
+
+	const {
+		formState: { errors },
+		handleSubmit,
+		control,
+		watch,
+		setValue,
+	} = useForm({
+		defaultValues: {
+			name: nameSuggestion || '',
+			parentRoom: '',
+			encrypted: encryptedParentRoom,
+			usernames: [],
+			firstMessage: '',
+			topic: '',
+		},
+	});
+
+	const onParentRoomChange = useStableCallback((room: IRoom | undefined) => {
+		if (!room) {
+			return;
+		}
+		setValue('encrypted', room.encrypted === true);
+		setEncryptedDisabled(room.encrypted === true);
+	});
+
+	const { encrypted } = watch();
+
+	const createDiscussion = useEndpoint('POST', '/v1/rooms.createDiscussion');
+
+	const goToRoom = useGoToRoom();
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const createDiscussionMutation = useMutation({
+		mutationFn: createDiscussion,
+		onSuccess: ({ discussion }) => {
+			goToRoom(discussion._id);
+			void onSuccess?.(discussion._id);
+			onClose();
+		},
+		onError: (error) => {
+			dispatchToastMessage({ type: 'error', message: error });
+		},
+	});
+
+	const handleCreate = async ({ name, parentRoom, encrypted, usernames, firstMessage, topic }: CreateDiscussionFormValues) => {
+		createDiscussionMutation.mutate({
+			prid: defaultParentRoom || parentRoom,
+			t_name: name,
+			users: usernames,
+			reply: encrypted ? undefined : firstMessage,
+			topic,
+			...(parentMessageId && { pmid: parentMessageId }),
+		});
+	};
+
+	const getEncryptedHint = useEncryptedRoomDescription('discussion');
+
+	return (
+		<GenericModal
+			variant='warning'
+			icon={null}
+			title={t('Discussion_title')}
+			onCancel={onClose}
+			wrapperFunction={(props) => <Box is='form' onSubmit={handleSubmit(handleCreate)} {...props} />}
+			confirmText={t('Create')}
+			cancelText={t('Cancel')}
+			confirmLoading={createDiscussionMutation.isPending}
+		>
+			<Box marginBlockEnd={24}>{t('Discussion_description')}</Box>
+			<FieldGroup>
+				<Field>
+					<FieldLabel required>{t('Discussion_target_channel')}</FieldLabel>
+					<FieldRow>
+						{defaultParentRoom && (
+							<Controller
+								control={control}
+								name='parentRoom'
+								render={() => <DefaultParentRoomField defaultParentRoom={defaultParentRoom} />}
+							/>
+						)}
+						{!defaultParentRoom && (
+							<Controller
+								control={control}
+								name='parentRoom'
+								rules={{ required: t('Required_field', { field: t('Discussion_target_channel') }) }}
+								render={({ field }) => (
+									<RoomAutoComplete
+										{...field}
+										error={Boolean(errors.parentRoom?.message)}
+										placeholder={t('Search_options')}
+										disabled={Boolean(defaultParentRoom)}
+										aria-required='true'
+										setSelectedRoom={onParentRoomChange}
+										renderRoomIcon={({ encrypted }) => (encrypted ? <Icon name='key' /> : null)}
+									/>
+								)}
+							/>
+						)}
+					</FieldRow>
+					{errors.parentRoom && <FieldError>{errors.parentRoom.message}</FieldError>}
+				</Field>
+				<Field>
+					<FieldLabel required>{t('Name')}</FieldLabel>
+					<FieldRow>
+						<Controller
+							name='name'
+							control={control}
+							rules={{ required: t('Required_field', { field: t('Name') }) }}
+							render={({ field }) => (
+								<TextInput {...field} aria-required='true' endAddon={<Icon name='baloons' size='x20' />} error={errors.name?.message} />
+							)}
+						/>
+					</FieldRow>
+					{errors.name && <FieldError>{errors.name.message}</FieldError>}
+				</Field>
+				<Field>
+					<FieldLabel>{t('Topic')}</FieldLabel>
+					<FieldRow>
+						<Controller name='topic' control={control} render={({ field }) => <TextInput {...field} error={errors.topic?.message} />} />
+					</FieldRow>
+					<FieldRow>
+						<FieldHint>{t('Displayed_next_to_name')}</FieldHint>
+					</FieldRow>
+				</Field>
+				<Field>
+					<FieldLabel>{t('Members')}</FieldLabel>
+					<FieldRow>
+						<Controller
+							control={control}
+							name='usernames'
+							render={({ field }) => <UserAutoCompleteMultiple {...field} placeholder={t('Add_people')} />}
+						/>
+					</FieldRow>
+				</Field>
+				<Field>
+					<FieldLabel>{t('Discussion_first_message_title')}</FieldLabel>
+					<FieldRow>
+						<Controller
+							control={control}
+							name='firstMessage'
+							render={({ field }) => <TextAreaInput {...field} rows={5} disabled={encrypted} />}
+						/>
+					</FieldRow>
+					{encrypted ? (
+						<FieldHint>{t('Discussion_first_message_disabled_due_to_e2e')}</FieldHint>
+					) : (
+						<FieldHint>{t('First_message_hint')}</FieldHint>
+					)}
+				</Field>
+				<Field>
+					<FieldRow>
+						<FieldLabel>{t('Encrypted')}</FieldLabel>
+						<Controller
+							control={control}
+							name='encrypted'
+							render={({ field: { value, ...field } }) => <ToggleSwitch {...field} checked={value} disabled={encryptedDisabled} />}
+						/>
+					</FieldRow>
+					<FieldHint>{getEncryptedHint({ isPrivate: true, encrypted })}</FieldHint>
+				</Field>
+			</FieldGroup>
+		</GenericModal>
+	);
+};
+
+export default CreateDiscussion;

apps/meteor/client/components/CreateDiscussion/DefaultParentRoomField.tsx

@@ -0,0 +1,54 @@
+import { Skeleton, Callout } from '@rocket.chat/fuselage';
+import { TextInput } from '@rocket.chat/fuselage-forms';
+import { useTranslation, useEndpoint } from '@rocket.chat/ui-contexts';
+import { useQuery } from '@tanstack/react-query';
+import type { ComponentPropsWithoutRef } from 'react';
+import { useMemo } from 'react';
+
+import { roomCoordinator } from '../../lib/rooms/roomCoordinator';
+
+export type DefaultParentRoomFieldProps = {
+	defaultParentRoom: string;
+} & Omit<ComponentPropsWithoutRef<typeof TextInput>, 'defaultValue' | 'disabled'>;
+
+const DefaultParentRoomField = ({ defaultParentRoom, ...props }: DefaultParentRoomFieldProps) => {
+	const t = useTranslation();
+
+	const query = useMemo(
+		() => ({
+			roomId: defaultParentRoom,
+		}),
+		[defaultParentRoom],
+	);
+
+	const roomsInfoEndpoint = useEndpoint('GET', '/v1/rooms.info');
+
+	const { data, isPending, isError } = useQuery({
+		queryKey: ['defaultParentRoomInfo', query],
+		queryFn: async () => roomsInfoEndpoint(query),
+		refetchOnWindowFocus: false,
+	});
+
+	if (isPending) {
+		return <Skeleton width='full' />;
+	}
+
+	if (!data?.room || isError) {
+		return <Callout type='danger'>{t('Error')}</Callout>;
+	}
+
+	return (
+		<TextInput
+			{...props}
+			defaultValue={roomCoordinator.getRoomName(data.room.t, {
+				_id: data.room._id,
+				fname: data.room.fname,
+				name: data.room.name,
+				prid: data.room.prid,
+			})}
+			disabled
+		/>
+	);
+};
+
+export default DefaultParentRoomField;

apps/meteor/client/components/CreateDiscussion/__snapshots__/CreateDiscussion.spec.tsx.snap

@@ -0,0 +1,347 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`CreateDiscussion renders Default without crashing 1`] = `
+<body>
+  <div>
+    <dialog
+      aria-labelledby="_r_0_-title"
+      aria-modal="true"
+      class="rcx-box rcx-box--full rcx-modal"
+      open=""
+    >
+      <form
+        class="rcx-box rcx-box--full rcx-modal__inner rcx-css-qtwduz"
+      >
+        <header
+          class="rcx-box rcx-box--full rcx-modal__header"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-modal__header-inner"
+          >
+            <div
+              class="rcx-box rcx-box--full rcx-modal__header-text rcx-css-trljwa rcx-css-lma364"
+            >
+              <h2
+                class="rcx-box rcx-box--full rcx-modal__title"
+                id="_r_0_-title"
+              >
+                Discussion_title
+              </h2>
+            </div>
+            <button
+              aria-label="Close"
+              class="rcx-box rcx-box--full rcx-button--small-square rcx-button--square rcx-button--icon rcx-button rcx-css-trljwa rcx-css-lma364"
+              tabindex="-1"
+              type="button"
+            >
+              <i
+                aria-hidden="true"
+                class="rcx-box rcx-box--full rcx-icon--name-cross rcx-icon rcx-css-4pvxx3"
+              >
+                
+              </i>
+            </button>
+          </div>
+        </header>
+        <div
+          class="rcx-box rcx-box--full rcx-modal__content rcx-css-1vw7itl"
+        >
+          <div
+            class="rcx-box rcx-box--full rcx-modal__content-wrapper rcx-css-r1bpeb"
+          >
+            <div
+              class="rcx-box rcx-box--full rcx-css-heem01"
+            >
+              Discussion_description
+            </div>
+            <fieldset
+              class="rcx-box rcx-box--full rcx-field-group"
+              role="group"
+            >
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <span
+                  class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  id="react-aria-_r_1_-label"
+                >
+                  Parent channel or team
+                  <span
+                    aria-hidden="true"
+                    class="rcx-box rcx-box--full rcx-label__required rcx-css-b7g1a9"
+                  >
+                    *
+                  </span>
+                </span>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <div
+                    class="rcx-box rcx-box--full rcx-box--animated rcx-autocomplete rcx-css-t3n91h"
+                  >
+                    <div
+                      class="rcx-box rcx-box--full rcx-css-6d871f"
+                      role="group"
+                    >
+                      <input
+                        aria-describedby=""
+                        aria-invalid="false"
+                        aria-labelledby="react-aria-_r_1_-label"
+                        aria-required="true"
+                        class="rcx-box rcx-box--full rcx-box--animated rcx-input-box--undecorated rcx-input-box rcx-css-trljwa rcx-css-rcil7k"
+                        id="react-aria-_r_1_"
+                        name="parentRoom"
+                        placeholder="Search_options"
+                        value=""
+                      />
+                    </div>
+                    <div
+                      class="rcx-box rcx-box--full rcx-autocomplete__addon"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="rcx-box rcx-box--full rcx-icon--name-magnifier rcx-icon rcx-css-l5txo2"
+                      >
+                        
+                      </i>
+                    </div>
+                  </div>
+                </span>
+              </div>
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <label
+                  class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  for="react-aria-_r_2_-label"
+                >
+                  Name
+                  <span
+                    aria-hidden="true"
+                    class="rcx-box rcx-box--full rcx-label__required rcx-css-b7g1a9"
+                  >
+                    *
+                  </span>
+                </label>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <label
+                    class="rcx-box rcx-box--full rcx-label rcx-box rcx-box--full rcx-box--animated rcx-input-box__wrapper"
+                  >
+                    <input
+                      aria-describedby=""
+                      aria-invalid="false"
+                      aria-required="true"
+                      class="rcx-box rcx-box--full rcx-box--animated rcx-input-box--undecorated rcx-input-box--type-text rcx-input-box"
+                      id="react-aria-_r_2_-label"
+                      name="name"
+                      size="1"
+                      type="text"
+                      value=""
+                    />
+                    <span
+                      class="rcx-box rcx-box--full rcx-input-box__addon"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="rcx-box rcx-box--full rcx-icon--name-baloons rcx-icon rcx-css-4pvxx3"
+                      >
+                        
+                      </i>
+                    </span>
+                  </label>
+                </span>
+              </div>
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <label
+                  class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  for="react-aria-_r_3_-label"
+                >
+                  Topic
+                </label>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <input
+                    aria-describedby="react-aria-_r_3_-hint"
+                    aria-invalid="false"
+                    class="rcx-box rcx-box--full rcx-box--animated rcx-input-box--type-text rcx-input-box"
+                    id="react-aria-_r_3_-label"
+                    name="topic"
+                    size="1"
+                    type="text"
+                    value=""
+                  />
+                </span>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <span
+                    class="rcx-box rcx-box--full rcx-field__hint"
+                    id="react-aria-_r_3_-hint"
+                  >
+                    Displayed_next_to_name
+                  </span>
+                </span>
+              </div>
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <span
+                  class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  id="react-aria-_r_4_-label"
+                >
+                  Members
+                </span>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <div
+                    class="rcx-box rcx-box--full rcx-box--animated rcx-select"
+                  >
+                    <div
+                      class="rcx-box rcx-box--full rcx-css-1sr8su7"
+                    >
+                      <div
+                        class="rcx-box rcx-box--full rcx-css-w398ts"
+                      >
+                        <input
+                          aria-controls="react-aria-_r_4_-listbox"
+                          aria-describedby=""
+                          aria-expanded="false"
+                          aria-haspopup="listbox"
+                          aria-invalid="false"
+                          aria-labelledby="react-aria-_r_4_-label"
+                          autocomplete="off"
+                          class="rcx-box rcx-box--full rcx-box--animated rcx-input-box--undecorated rcx-input-box rcx-css-trljwa rcx-css-pqpp8q"
+                          id="react-aria-_r_4_"
+                          name="usernames"
+                          placeholder="Add_people"
+                          role="combobox"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                    <div
+                      class="rcx-box rcx-box--full rcx-select__addon rcx-css-x7bl3q rcx-css-1bprq55"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="rcx-box rcx-box--full rcx-icon--name-chevron-down rcx-icon rcx-css-4pvxx3"
+                      >
+                        
+                      </i>
+                    </div>
+                  </div>
+                </span>
+              </div>
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <label
+                  class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  for="react-aria-_r_5_-label"
+                >
+                  Message
+                </label>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <textarea
+                    aria-describedby="react-aria-_r_5_-hint"
+                    aria-invalid="false"
+                    class="rcx-box rcx-box--full rcx-box--animated rcx-input-box--type-textarea rcx-input-box"
+                    cols="1"
+                    id="react-aria-_r_5_-label"
+                    name="firstMessage"
+                    rows="5"
+                    size="1"
+                  />
+                </span>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__hint"
+                  id="react-aria-_r_5_-hint"
+                >
+                  First_message_hint
+                </span>
+              </div>
+              <div
+                class="rcx-box rcx-box--full rcx-field rcx-field-group__item"
+              >
+                <span
+                  class="rcx-box rcx-box--full rcx-field__row"
+                >
+                  <span
+                    class="rcx-box rcx-box--full rcx-field__label rcx-label"
+                  >
+                    Encrypted
+                  </span>
+                  <label
+                    class="rcx-box rcx-box--full rcx-toggle-switch"
+                  >
+                    <div
+                      style="border: 0px; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
+                    >
+                      Encrypted
+                    </div>
+                    <input
+                      aria-describedby="react-aria-_r_6_-hint"
+                      aria-invalid="false"
+                      class="rcx-box rcx-box--full rcx-toggle-switch__input"
+                      id="react-aria-_r_6_-label"
+                      name="encrypted"
+                      type="checkbox"
+                    />
+                    <i
+                      aria-hidden="true"
+                      class="rcx-box rcx-box--full rcx-toggle-switch__fake"
+                    />
+                  </label>
+                </span>
+                <span
+                  class="rcx-box rcx-box--full rcx-field__hint"
+                  id="react-aria-_r_6_-hint"
+                >
+                  Not_available_for_this_workspace
+                </span>
+              </div>
+            </fieldset>
+          </div>
+        </div>
+        <div
+          class="rcx-box rcx-box--full rcx-modal__footer rcx-css-17mu816"
+        >
+          <div
+            class="rcx-button-group rcx-button-group--align-end"
+            role="group"
+          >
+            <button
+              class="rcx-box rcx-box--full rcx-button--secondary rcx-button"
+              type="button"
+            >
+              <span
+                class="rcx-button--content"
+              >
+                Cancel
+              </span>
+            </button>
+            <button
+              class="rcx-box rcx-box--full rcx-button--primary rcx-button"
+              type="submit"
+            >
+              <span
+                class="rcx-button--content"
+              >
+                Create
+              </span>
+            </button>
+          </div>
+        </div>
+      </form>
+    </dialog>
+  </div>
+</body>
+`;

apps/meteor/client/components/CreateDiscussion/index.ts

@@ -0,0 +1 @@
+export { default } from './CreateDiscussion';