Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 4f55ac1

Browse files
t3chguyt3chguy
authored
Merge pull request #6025 from matrix-org/t3chguy/fix/16674
Improve Spaces "Just Me" wizard
2 parents bdeb4b3 + e1df624 commit 4f55ac1

File tree

4 files changed

+208
-241
lines changed

4 files changed

+208
-241
lines changed

‎res/css/views/dialogs/_AddExistingToSpaceDialog.scss‎

Lines changed: 84 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,90 @@ limitations under the License.
105105
mask-position: center;
106106
}
107107
}
108+
109+
.mx_AddExistingToSpace_footer {
110+
display: flex;
111+
margin-top: 20px;
112+
113+
> span {
114+
flex-grow: 1;
115+
font-size: $font-12px;
116+
line-height: $font-15px;
117+
color: $secondary-fg-color;
118+
119+
.mx_ProgressBar {
120+
height: 8px;
121+
width: 100%;
122+
123+
@mixin ProgressBarBorderRadius 8px;
124+
}
125+
126+
.mx_AddExistingToSpace_progressText {
127+
margin-top: 8px;
128+
font-size: $font-15px;
129+
line-height: $font-24px;
130+
color: $primary-fg-color;
131+
}
132+
133+
> * {
134+
vertical-align: middle;
135+
}
136+
}
137+
138+
.mx_AddExistingToSpace_error {
139+
padding-left: 12px;
140+
141+
> img {
142+
align-self: center;
143+
}
144+
145+
.mx_AddExistingToSpace_errorHeading {
146+
font-weight: $font-semi-bold;
147+
font-size: $font-15px;
148+
line-height: $font-18px;
149+
color: $notice-primary-color;
150+
}
151+
152+
.mx_AddExistingToSpace_errorCaption {
153+
margin-top: 4px;
154+
font-size: $font-12px;
155+
line-height: $font-15px;
156+
color: $primary-fg-color;
157+
}
158+
}
159+
160+
.mx_AccessibleButton {
161+
display: inline-block;
162+
align-self: center;
163+
}
164+
165+
.mx_AccessibleButton_kind_primary {
166+
padding: 8px 36px;
167+
}
168+
169+
.mx_AddExistingToSpace_retryButton {
170+
margin-left: 12px;
171+
padding-left: 24px;
172+
position: relative;
173+
174+
&::before {
175+
content: '';
176+
position: absolute;
177+
background-color: $primary-fg-color;
178+
mask-repeat: no-repeat;
179+
mask-position: center;
180+
mask-size: contain;
181+
mask-image: url('$(res)/img/element-icons/retry.svg');
182+
width: 18px;
183+
height: 18px;
184+
left: 0;
185+
}
186+
}
187+
188+
.mx_AccessibleButton_kind_link {
189+
padding: 0;
190+
}
191+
}
108192
}
109193

110194
.mx_AddExistingToSpaceDialog {
@@ -189,88 +273,4 @@ limitations under the License.
189273
.mx_AddExistingToSpace {
190274
display: contents;
191275
}
192-
193-
.mx_AddExistingToSpaceDialog_footer {
194-
display: flex;
195-
margin-top: 20px;
196-
197-
> span {
198-
flex-grow: 1;
199-
font-size: $font-12px;
200-
line-height: $font-15px;
201-
color: $secondary-fg-color;
202-
203-
.mx_ProgressBar {
204-
height: 8px;
205-
width: 100%;
206-
207-
@mixin ProgressBarBorderRadius 8px;
208-
}
209-
210-
.mx_AddExistingToSpaceDialog_progressText {
211-
margin-top: 8px;
212-
font-size: $font-15px;
213-
line-height: $font-24px;
214-
color: $primary-fg-color;
215-
}
216-
217-
> * {
218-
vertical-align: middle;
219-
}
220-
}
221-
222-
.mx_AddExistingToSpaceDialog_error {
223-
padding-left: 12px;
224-
225-
> img {
226-
align-self: center;
227-
}
228-
229-
.mx_AddExistingToSpaceDialog_errorHeading {
230-
font-weight: $font-semi-bold;
231-
font-size: $font-15px;
232-
line-height: $font-18px;
233-
color: $notice-primary-color;
234-
}
235-
236-
.mx_AddExistingToSpaceDialog_errorCaption {
237-
margin-top: 4px;
238-
font-size: $font-12px;
239-
line-height: $font-15px;
240-
color: $primary-fg-color;
241-
}
242-
}
243-
244-
.mx_AccessibleButton {
245-
display: inline-block;
246-
align-self: center;
247-
}
248-
249-
.mx_AccessibleButton_kind_primary {
250-
padding: 8px 36px;
251-
}
252-
253-
.mx_AddExistingToSpaceDialog_retryButton {
254-
margin-left: 12px;
255-
padding-left: 24px;
256-
position: relative;
257-
258-
&::before {
259-
content: '';
260-
position: absolute;
261-
background-color: $primary-fg-color;
262-
mask-repeat: no-repeat;
263-
mask-position: center;
264-
mask-size: contain;
265-
mask-image: url('$(res)/img/element-icons/retry.svg');
266-
width: 18px;
267-
height: 18px;
268-
left: 0;
269-
}
270-
}
271-
272-
.mx_AccessibleButton_kind_link {
273-
padding: 0;
274-
}
275-
}
276276
}

‎src/components/structures/SpaceRoomView.tsx‎

Lines changed: 7 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -52,8 +52,6 @@ import {useStateToggle} from "../../hooks/useStateToggle";
5252
import SpaceStore from "../../stores/SpaceStore";
5353
import FacePile from "../views/elements/FacePile";
5454
import {AddExistingToSpace} from "../views/dialogs/AddExistingToSpaceDialog";
55-
import {sleep} from "../../utils/promise";
56-
import {calculateRoomVia} from "../../utils/permalinks/Permalinks";
5755
import {ChevronFace, ContextMenuButton, useContextMenu} from "./ContextMenu";
5856
import IconizedContextMenu, {
5957
IconizedContextMenuOption,
@@ -519,69 +517,25 @@ const SpaceSetupFirstRooms = ({ space, title, description, onFinished }) => {
519517
};
520518

521519
const SpaceAddExistingRooms = ({ space, onFinished }) => {
522-
const [selectedToAdd, setSelectedToAdd] = useState(new Set<Room>());
523-
524-
const [busy, setBusy] = useState(false);
525-
const [error, setError] = useState("");
526-
527-
let onClick = onFinished;
528-
let buttonLabel = _t("Skip for now");
529-
if (selectedToAdd.size > 0) {
530-
onClick = async () => {
531-
setBusy(true);
532-
533-
for (const room of selectedToAdd) {
534-
const via = calculateRoomVia(room);
535-
try {
536-
await SpaceStore.instance.addRoomToSpace(space, room.roomId, via).catch(async e => {
537-
if (e.errcode === "M_LIMIT_EXCEEDED") {
538-
await sleep(e.data.retry_after_ms);
539-
return SpaceStore.instance.addRoomToSpace(space, room.roomId, via); // retry
540-
}
541-
542-
throw e;
543-
});
544-
} catch (e) {
545-
console.error("Failed to add rooms to space", e);
546-
setError(_t("Failed to add rooms to space"));
547-
break;
548-
}
549-
}
550-
setBusy(false);
551-
};
552-
buttonLabel = busy ? _t("Adding...") : _t("Add");
553-
}
554-
555520
return <div>
556521
<h1>{ _t("What do you want to organise?") }</h1>
557522
<div className="mx_SpaceRoomView_description">
558523
{ _t("Pick rooms or conversations to add. This is just a space for you, " +
559524
"no one will be informed. You can add more later.") }
560525
</div>
561526

562-
{ error && <div className="mx_SpaceRoomView_errorText">{ error }</div> }
563-
564527
<AddExistingToSpace
565528
space={space}
566-
selected={selectedToAdd}
567-
onChange={(checked, room) => {
568-
if (checked) {
569-
selectedToAdd.add(room);
570-
} else {
571-
selectedToAdd.delete(room);
572-
}
573-
setSelectedToAdd(new Set(selectedToAdd));
574-
}}
529+
emptySelectionButton={
530+
<AccessibleButton kind="primary" onClick={onFinished}>
531+
{ _t("Skip for now") }
532+
</AccessibleButton>
533+
}
534+
onFinished={onFinished}
575535
/>
576536

577537
<div className="mx_SpaceRoomView_buttons">
578-
<AccessibleButton
579-
kind="primary"
580-
disabled={busy}
581-
onClick={onClick}
582-
>
583-
{ buttonLabel }
584-
</AccessibleButton>
538+
585539
</div>
586540
<SpaceFeedbackPrompt />
587541
</div>;

0 commit comments

Comments
 (0)