Skip to content
This repository was archived by the owner on Nov 6, 2023. It is now read-only.

Chat exm improve #312

Open
Gerelsukh wants to merge 5 commits into
base: dev
Choose a base branch
from
Open

Chat exm improve #312

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
fc53c58
avatar image add on form
Gerelsukh Sep 19, 2023
55732d9
direct massage avatar initial center
Gerelsukh Sep 19, 2023
88f1b91
exm-core config add field
Gerelsukh Sep 19, 2023
67976fb
remove welcome content from exm core
Gerelsukh Sep 19, 2023
6fe5479
color add on exm-core
Gerelsukh Sep 19, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 37 additions & 34 deletions exm/modules/exmFeed/components/Home.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,37 +9,37 @@ import {
NoEvent,
FeedWrapper,
FlexAlignCenter
} from "../styles";
import { MainContainer, SideContainer } from "../../layout/styles";
import React, { useState } from "react";
import { TabTitle, Tabs } from "../../common/tabs";

import ChatList from "../containers/chat/ChatList";
import Form from "../containers/feed/Form";
import { IUser } from "../../auth/types";
} from '../styles';
import { MainContainer, SideContainer } from '../../layout/styles';
import React, { useState } from 'react';
import { TabTitle, Tabs } from '../../common/tabs';

import ChatList from '../containers/chat/ChatList';
import Form from '../containers/feed/Form';
import { IUser } from '../../auth/types';
// import Icon from '../../common/Icon';
import List from "../containers/feed/List";
import ThankForm from "../containers/feed/ThankForm";
import ThankList from "../containers/feed/ThankList";
import { Wrapper } from "../../layout";
import { __ } from "../../../utils";
import WidgetChatWindow from "../containers/chat/WidgetChatWindow";
import Icon from "../../common/Icon";
import { readFile } from "../../common/utils";
import List from '../containers/feed/List';
import ThankForm from '../containers/feed/ThankForm';
import ThankList from '../containers/feed/ThankList';
import { Wrapper } from '../../layout';
import { __ } from '../../../utils';
import WidgetChatWindow from '../containers/chat/WidgetChatWindow';
import Icon from '../../common/Icon';
import { readFile } from '../../common/utils';

type Props = {
queryParams: any;
todayEvents?: any;
currentUser: IUser;
};

const LOCALSTORAGE_KEY = "erxes_active_chats";
const LOCALSTORAGE_KEY = 'erxes_active_chats';

export default function Home(props: Props) {
const [currentTab, setCurrentTab] = useState("post");
const [currentTab, setCurrentTab] = useState('post');
const { queryParams, currentUser, todayEvents } = props;
const [activeChatIds, setActiveChatIds] = useState<any[]>(
JSON.parse(localStorage.getItem(LOCALSTORAGE_KEY) || "[]")
JSON.parse(localStorage.getItem(LOCALSTORAGE_KEY) || '[]')
);

const onClickTab = (type: string) => {
Expand All @@ -65,7 +65,7 @@ export default function Home(props: Props) {
};

const renderTabContent = () => {
if (currentTab === "thankyou") {
if (currentTab === 'thankyou') {
return (
<>
<ThankForm queryParams={queryParams} />
Expand All @@ -74,7 +74,7 @@ export default function Home(props: Props) {
);
}

if (currentTab === "welcome") {
if (currentTab === 'welcome') {
return (
<>
<List queryParams={queryParams} contentType={currentTab} />
Expand All @@ -84,7 +84,7 @@ export default function Home(props: Props) {

return (
<>
<Form contentType={currentTab} />
<Form contentType={currentTab} currentUser={currentUser} />
<List queryParams={queryParams} contentType={currentTab} />
</>
);
Expand Down Expand Up @@ -115,7 +115,10 @@ export default function Home(props: Props) {
<FlexAlignCenter key={e._id}>
{e.images.length > 0 && (
<div className="image-wrapper">
<img src={readFile(e.images[0].url)} alt="event-img" />
<img
src={readFile(e.images[0].url)}
alt="event-img"
/>
</div>
)}
<div>
Expand Down Expand Up @@ -155,32 +158,32 @@ export default function Home(props: Props) {
<MainContainer>
<Tabs full={true}>
<TabTitle
className={currentTab === "post" ? "active" : ""}
onClick={() => onClickTab("post")}
className={currentTab === 'post' ? 'active' : ''}
onClick={() => onClickTab('post')}
>
Post
</TabTitle>
<TabTitle
className={currentTab === "event" ? "active" : ""}
onClick={() => onClickTab("event")}
className={currentTab === 'event' ? 'active' : ''}
onClick={() => onClickTab('event')}
>
Event
</TabTitle>
<TabTitle
className={currentTab === "bravo" ? "active" : ""}
onClick={() => onClickTab("bravo")}
className={currentTab === 'bravo' ? 'active' : ''}
onClick={() => onClickTab('bravo')}
>
Bravo
</TabTitle>
<TabTitle
className={currentTab === "publicHoliday" ? "active" : ""}
onClick={() => onClickTab("publicHoliday")}
className={currentTab === 'publicHoliday' ? 'active' : ''}
onClick={() => onClickTab('publicHoliday')}
>
Public holiday
</TabTitle>
<TabTitle
className={currentTab === "welcome" ? "active" : ""}
onClick={() => onClickTab("welcome")}
className={currentTab === 'welcome' ? 'active' : ''}
onClick={() => onClickTab('welcome')}
>
Welcome
</TabTitle>
Expand Down Expand Up @@ -210,7 +213,7 @@ export default function Home(props: Props) {

return (
<Wrapper
header={<Wrapper.Header title={"Feed"} />}
header={<Wrapper.Header title={'Feed'} />}
content={renderContent()}
transparent={true}
initialOverflow={true}
Expand Down
89 changes: 49 additions & 40 deletions exm/modules/exmFeed/components/feed/EventForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,21 @@
import { CustomRangeContainer, UploadItems } from "../../styles";
import { IButtonMutateProps, IFormProps } from "../../../common/types";
import React, { useState } from "react";
import { description, getDepartmentOptions, title } from "../../utils";

import ControlLabel from "../../../common/form/Label";
import DateControl from "../../../common/form/DateControl";
import { Form, FormGroup } from "../../../common/form";
import FormControl from "../../../common/form/Control";
import GenerateFields from "../GenerateFields";
import Select from "react-select-plus";
import SelectTeamMembers from "../../../common/team/containers/SelectTeamMembers";
import Uploader from "../../../common/Uploader";
import { CreateFormContainer, CreateInput, FlexRow } from "../../styles";
import ModalTrigger from "../../../common/ModalTrigger";
import NameCard from "../../../common/nameCard/NameCard";
import { __ } from "../../../../utils";
import { CustomRangeContainer, UploadItems } from '../../styles';
import { IButtonMutateProps, IFormProps } from '../../../common/types';
import React, { useState } from 'react';
import { description, getDepartmentOptions, title } from '../../utils';

import ControlLabel from '../../../common/form/Label';
import DateControl from '../../../common/form/DateControl';
import { Form, FormGroup } from '../../../common/form';
import FormControl from '../../../common/form/Control';
import GenerateFields from '../GenerateFields';
import Select from 'react-select-plus';
import SelectTeamMembers from '../../../common/team/containers/SelectTeamMembers';
import Uploader from '../../../common/Uploader';
import { CreateFormContainer, CreateInput, FlexRow } from '../../styles';
import ModalTrigger from '../../../common/ModalTrigger';
import NameCard from '../../../common/nameCard/NameCard';
import { __ } from '../../../../utils';
import { IUser } from '../../../auth/types';

type Props = {
item?: any;
Expand All @@ -25,10 +26,18 @@ type Props = {
isEdit?: boolean;
branches: any[];
units: any[];
currentUser: IUser;
};

export default function EventForm(props: Props) {
const { item = {}, fields, departments, branches, units } = props;
const {
item = {},
fields,
departments,
branches,
units,
currentUser
} = props;

const [attachments, setAttachment] = useState(item.attachments || []);
const [images, setImages] = useState(item.images || []);
Expand All @@ -39,15 +48,15 @@ export default function EventForm(props: Props) {
const itemEventData = item.eventData || {};

const [eventData, setEventData] = useState({
visibility: itemEventData.visibility || "public",
where: itemEventData.where || "",
visibility: itemEventData.visibility || 'public',
where: itemEventData.where || '',
startDate: itemEventData.startDate,
endDate: itemEventData.endDate,
endDate: itemEventData.endDate
});

const [departmentIds, setDepartmentIds] = useState(item?.departmentIds || []);
const [branchIds, setBranchIds] = useState(item?.branchIds || []);
const [unitId, setUnitId] = useState(item?.unitId || "");
const [unitId, setUnitId] = useState(item?.unitId || '');

const onChangeDepartment = (option: any) => {
setDepartmentIds(option.map((data) => data.value) || []);
Expand All @@ -58,7 +67,7 @@ export default function EventForm(props: Props) {
};

const onChangeUnit = (option: any) => {
setUnitId(option?.value || "");
setUnitId(option?.value || '');
};

const onChangeEventData = (key, value) => {
Expand All @@ -75,10 +84,10 @@ export default function EventForm(props: Props) {
<FormControl
componentClass="radio"
name="visibility"
checked={eventData.visibility === "public"}
checked={eventData.visibility === 'public'}
value="public"
onChange={(e: any) =>
onChangeEventData("visibility", e.target.value)
onChangeEventData('visibility', e.target.value)
}
>
Public
Expand All @@ -87,15 +96,15 @@ export default function EventForm(props: Props) {
componentClass="radio"
name="visibility"
value="private"
checked={eventData.visibility === "private"}
checked={eventData.visibility === 'private'}
onChange={(e: any) =>
onChangeEventData("visibility", e.target.value)
onChangeEventData('visibility', e.target.value)
}
>
Private
</FormControl>
</FormGroup>
{eventData.visibility === "private" && (
{eventData.visibility === 'private' && (
<>
<SelectTeamMembers
label="Invite people"
Expand All @@ -112,19 +121,19 @@ export default function EventForm(props: Props) {
value={eventData.startDate}
required={true}
name="startDate"
onChange={(date) => onChangeEventData("startDate", date)}
placeholder={"Start date (required)"}
dateFormat={"YYYY-MM-DD HH:mm:ss"}
onChange={(date) => onChangeEventData('startDate', date)}
placeholder={'Start date (required)'}
dateFormat={'YYYY-MM-DD HH:mm:ss'}
timeFormat={true}
/>
<DateControl
{...formProps}
value={eventData.endDate}
required={true}
name="endDate"
placeholder={"End date (required)"}
onChange={(date) => onChangeEventData("endDate", date)}
dateFormat={"YYYY-MM-DD HH:mm:ss"}
placeholder={'End date (required)'}
onChange={(date) => onChangeEventData('endDate', date)}
dateFormat={'YYYY-MM-DD HH:mm:ss'}
timeFormat={true}
/>
</CustomRangeContainer>
Expand All @@ -137,7 +146,7 @@ export default function EventForm(props: Props) {
placeholder="Where"
componentClass="textarea"
value={eventData.where}
onChange={(e: any) => onChangeEventData("where", e.target.value)}
onChange={(e: any) => onChangeEventData('where', e.target.value)}
/>
</FormGroup>
<Select
Expand Down Expand Up @@ -204,18 +213,18 @@ export default function EventForm(props: Props) {
values: {
title: values.title,
description: values.description ? values.description : null,
contentType: "event",
contentType: 'event',
attachments,
images,
recipientIds,
customFieldsData,
eventData,
departmentIds,
branchIds,
unitId,
unitId
},
isSubmitted,
callback: closeModal ? closeModal : insideCloseModal,
callback: closeModal ? closeModal : insideCloseModal
})}
</>
);
Expand All @@ -234,12 +243,12 @@ export default function EventForm(props: Props) {
return (
<CreateFormContainer>
<FlexRow>
<NameCard.Avatar user={{}} size={45} />
<NameCard.Avatar user={currentUser} size={45} />
<ModalTrigger
dialogClassName="create-post"
size="lg"
title="Create post"
trigger={<CreateInput>{__("Create new event")}</CreateInput>}
trigger={<CreateInput>{__('Create new event')}</CreateInput>}
content={content}
/>
</FlexRow>
Expand Down
Loading