integrated new CreateRoomDialog in CreateRoomEvent and added tag functionality
This commit is contained in:
parent
2ce7d29466
commit
63829f01eb
@ -1,65 +1,75 @@
|
|||||||
import React from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { inject, observer } from "mobx-react";
|
import { inject, observer } from "mobx-react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
|
|
||||||
import toastr from "studio/toastr";
|
import toastr from "studio/toastr";
|
||||||
|
import { CreateRoomDialog } from "../dialogs";
|
||||||
|
import { addTagsToRoom } from "@appserver/common/api/rooms";
|
||||||
|
|
||||||
import { RoomsType } from "@appserver/common/constants";
|
const CreateRoomEvent = ({
|
||||||
|
createRoom,
|
||||||
|
createTag,
|
||||||
|
addTagsToRoom,
|
||||||
|
fetchTags,
|
||||||
|
onClose,
|
||||||
|
|
||||||
import Dialog from "./sub-components/Dialog";
|
currrentFolderId,
|
||||||
|
updateCurrentFolder,
|
||||||
|
}) => {
|
||||||
|
const { t } = useTranslation(["CreateRoomDialog", "Translations", "Common"]);
|
||||||
|
const [fetchedTags, setFetchedTags] = useState([]);
|
||||||
|
|
||||||
const CreateRoomEvent = ({ createRoom, updateCurrentFolder, id, onClose }) => {
|
const onCreate = async (roomParams) => {
|
||||||
const options = [
|
console.log(roomParams);
|
||||||
{ key: RoomsType.CustomRoom, label: "Custom room" },
|
const createRoomParams = {
|
||||||
{ key: RoomsType.FillingFormsRoom, label: "Filling form room" },
|
roomType: roomParams.type,
|
||||||
{ key: RoomsType.EditingRoom, label: "Editing room" },
|
title: roomParams.title || "New room",
|
||||||
{ key: RoomsType.ReviewRoom, label: "Review room" },
|
|
||||||
{ key: RoomsType.ReadOnlyRoom, label: "View-only room" },
|
|
||||||
];
|
|
||||||
|
|
||||||
const [selectedOption, setSelectedOption] = React.useState(options[0]);
|
|
||||||
|
|
||||||
const { t } = useTranslation(["Translations", "Common"]);
|
|
||||||
|
|
||||||
const onSelect = (item) => {
|
|
||||||
setSelectedOption(item);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const onSave = (e, value) => {
|
const tags = roomParams.tags.map((tag) => tag.name);
|
||||||
createRoom(value, selectedOption.key)
|
const newTags = roomParams.tags
|
||||||
.then(() => {
|
.filter((tag) => tag.isNew)
|
||||||
updateCurrentFolder(null, id);
|
.map((tag) => tag.name);
|
||||||
})
|
console.log(tags, newTags);
|
||||||
.finally(() => {
|
|
||||||
|
const room = await createRoom(createRoomParams);
|
||||||
|
console.log(room);
|
||||||
|
for (let i = 0; i < newTags.length; i++) await createTag(newTags[i]);
|
||||||
|
await addTagsToRoom(room.id, tags);
|
||||||
|
await updateCurrentFolder(null, currrentFolderId);
|
||||||
onClose();
|
onClose();
|
||||||
toastr.success(`${value} success created`);
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
useEffect(async () => {
|
||||||
|
let tags = await fetchTags();
|
||||||
|
setFetchedTags(tags);
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog
|
<CreateRoomDialog
|
||||||
t={t}
|
t={t}
|
||||||
title={"Create room"}
|
|
||||||
startValue={"New room"}
|
|
||||||
visible={true}
|
visible={true}
|
||||||
options={options}
|
|
||||||
selectedOption={selectedOption}
|
|
||||||
onSelect={onSelect}
|
|
||||||
onSave={onSave}
|
|
||||||
onCancel={onClose}
|
|
||||||
onClose={onClose}
|
onClose={onClose}
|
||||||
|
onCreate={onCreate}
|
||||||
|
fetchedTags={fetchedTags}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default inject(
|
export default inject(
|
||||||
({ filesStore, filesActionsStore, selectedFolderStore }) => {
|
({ filesStore, tagsStore, filesActionsStore, selectedFolderStore }) => {
|
||||||
const { createRoom } = filesStore;
|
const { createRoom, addTagsToRoom } = filesStore;
|
||||||
|
const { createTag, fetchTags } = tagsStore;
|
||||||
const { updateCurrentFolder } = filesActionsStore;
|
|
||||||
|
|
||||||
const { id } = selectedFolderStore;
|
const { id } = selectedFolderStore;
|
||||||
|
const { updateCurrentFolder } = filesActionsStore;
|
||||||
|
|
||||||
return { createRoom, updateCurrentFolder, id };
|
return {
|
||||||
|
createRoom,
|
||||||
|
createTag,
|
||||||
|
fetchTags,
|
||||||
|
addTagsToRoom,
|
||||||
|
currrentFolderId: id,
|
||||||
|
updateCurrentFolder,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
)(observer(CreateRoomEvent));
|
)(observer(CreateRoomEvent));
|
||||||
|
Loading…
Reference in New Issue
Block a user