();
-
- const save = useCallback(() => {
- updateStatus(status);
- MenusManager.closeMenu();
- }, [status, updateStatus]);
-
- const reset = useCallback(() => {
- updateStatus(['', '']);
- MenusManager.closeMenu();
- }, [updateStatus]);
-
- useEffect(() => {
- inputRef.current?.focus();
- }, []);
-
- return (
- {
- if (evt.key === 'Enter') save();
- }}
- >
-
node && (inputRef.current = node)}
- focusOnDidMount
- menu_level={level}
- placeholder={Languages.t(
- 'scenes.app.popup.appsparameters.pages.status_tilte',
- [],
- 'Status',
- )}
- value={status}
- onChange={(value: string[]) => {
- setStatus(value);
- inputRef.current?.focus();
- }}
- />
-
-
-
-
- {WorkspaceUserRights.isInvite() && !tutorial_status.no_invite && false && (
- {group.name},
- ]}
- subtitle={
- // eslint-disable-next-line no-constant-condition
- true
- ? ''
- : Languages.t(
- 'scenes.app.channelsbar.company_invitation_alert_subtitle',
- [],
- 'Vous pouvez importer ces chaînes dans votre entreprise pour rester organisé en cliquant sur ce cadre.',
- )
- }
- onClickFrame={e => {
- /*window.open("https://twakeapp.com/")*/
- }}
- onClose={e => this.removeTuto('no_invite', e)}
- />
- )}
-
- {!WorkspaceUserRights.isInvite() && !tutorial_status.no_tuto && (
- ,
- ]}
- subtitle={Languages.t(
- 'scenes.app.channelsbar.welcoming_message_subtitle',
- [],
- 'Devenez un pro de Twake en seulement quelques clics !',
- )}
- blocks={[
- {
- text: Languages.t(
- 'scenes.app.channelsbar.initial_instructions_tutorial',
- [],
- 'Choisissez un prénom, un nom et une image de profil.',
- ),
- emoji: ':woman_juggling:',
- done: tutorial_status.has_identity,
- onClick: () => {
- popupManager.open();
- },
- },
- {
- text: Languages.t(
- 'scenes.app.channelsbar.sending_message_instruction',
- [],
- 'Envoyer un premier message dans une discussion',
- ),
- emoji: ':love_letter:',
- done: tutorial_status.first_message_sent,
- },
- /*{
- text: "Installer l'application mobile",
- emoji: ":iphone:",
- done: tutorial_status.has_mobile_app,
- onClick: ()=>{ Globals.window.open("https://twakeapp.com/download") }
- },*/
- {
- text: Languages.t(
- 'scenes.app.channelsbar.installation_desktop_tutorial',
- [],
- "Installer l'application desktop",
- ),
- emoji: ':desktop:',
- done: tutorial_status.has_desktop_app,
- onClick: () => {
- Globals.window.open('https://twakeapp.com/download');
- },
- },
- {
- text: Languages.t(
- 'scenes.app.channelsbar.invitation_collaboraors_tutorial',
- [],
- 'Invitez vos collaborateurs dans votre espace de travail.',
- ),
- emoji: ':handshake:',
- done: tutorial_status.did_invite_collaborators,
- onClick: () => {
- popupManager.open(
- ,
- true,
- 'workspace_parameters',
- );
- },
- },
- ]}
- onClose={e => this.removeTuto('no_tuto', e)}
- />
- )}
-
- );
- }
-}
diff --git a/twake/frontend/src/app/views/client/channels-bar/Parts/Tutorial/Tutorial.jsx b/twake/frontend/src/app/views/client/channels-bar/Parts/Tutorial/Tutorial.jsx
deleted file mode 100755
index 07f9cffb..00000000
--- a/twake/frontend/src/app/views/client/channels-bar/Parts/Tutorial/Tutorial.jsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import React, { Component } from 'react';
-
-import './Tutorial.scss';
-
-import Icon from 'app/components/icon/icon.jsx';
-import Emojione from 'components/emojione/emojione';
-
-export default class Tutorial extends React.Component {
- constructor(props) {
- super();
- }
- render() {
- return (
-
-
{
- evt.preventDefault();
- evt.stopPropagation();
- this.props.onClose && this.props.onClose(evt);
- }}
- >
-
-
-
- {this.props.title &&
{this.props.title}
}
- {this.props.subtitle &&
{this.props.subtitle}
}
-
- {this.props.blocks && this.props.blocks.length > 0 && (
-
- {(this.props.blocks || [])
- .sort((a, b) => (a.done ? 1 : -1))
- .map((item, i) => {
- return (
-
- {(item.emoji || item.done) && (
-
-
-
- )}
-
{item.text}
-
- );
- })}
-
- )}
-
-
-
-
- {getDefaultApplicationIcon(application)}
-
-
- {capitalize(channel.name)}
-
-
-
-
-
-
-
- {
- // Temporary, it's for spacing when the hamburger menu is displayed
-
- }
- {channel.visibility === 'direct' && (
-
-
-
- )}
- {channel.visibility !== 'direct' && (
-
-
-
- ) : (
- false
- )
- }
- avatar={(channel?.icon?.length || 0) > 20 ? channel?.icon : ''}
- title={channel?.name || ''}
- />
-
- {channel.name}
-
- {channel.visibility === 'private' && }
-
- {PseudoMarkdownCompiler.compileToHTML(
- PseudoMarkdownCompiler.compileToJSON(
- (channel.description || '').replace(/\n/g, ' '),
- ),
- )}
-
-
-
- )}
-
-
- {!!channel.user_member?.user_id && (
-
- {channel.visibility !== 'direct' && channel.workspace_id && (
-
-
-
- )}
- {channel.visibility !== 'direct' && (
- <>
- {canAccessChannelParameters && (
-
- )}
-
-
- )}
-
-
- )}
-
-
-
-
-
-
- {avatar}
-
-
- {name}
-
- {otherMembers.length === 1 &&
- lastSeen > 0 &&
- lastSeen > Date.now() - 1000 * 60 * 60 * 24 * 70 &&
- currentUser?.id !== user?.id && (
- <>
- {!userOnlineStatus.connected && (
-
- {Languages.t('general.user.connected')} {moment(lastSeen).fromNow()}
-
- )}
- {!!userOnlineStatus.connected && (
-
- {Languages.t('general.user.connected')}
-
- )}
-
- )}
-
-
- );
-};
diff --git a/twake/frontend/src/app/views/client/main-view/MainHeader/MainHeader.tsx b/twake/frontend/src/app/views/client/main-view/MainHeader/MainHeader.tsx
deleted file mode 100644
index f4a84822..00000000
--- a/twake/frontend/src/app/views/client/main-view/MainHeader/MainHeader.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React, { FC } from 'react';
-import { Layout } from 'antd';
-import ChannelBar from './ChannelHeader/ChannelHeader';
-import MainViewService from 'app/features/router/services/main-view-service';
-import ApplicationBar from './ApplicationHeader/ApplicationHeader';
-import useRouterChannel from 'app/features/router/hooks/use-router-channel';
-
-const MainHeader: FC = () => {
- const channelId = useRouterChannel();
- const channelType = MainViewService.useWatcher(() => MainViewService.getViewType());
-
- return (
-
- {channelType === 'channel' && }
- {channelType === 'application' && }
-
- );
-};
-
-export default MainHeader;
diff --git a/twake/frontend/src/app/views/client/main-view/MainView.tsx b/twake/frontend/src/app/views/client/main-view/MainView.tsx
index 4effb899..6bc92526 100644
--- a/twake/frontend/src/app/views/client/main-view/MainView.tsx
+++ b/twake/frontend/src/app/views/client/main-view/MainView.tsx
@@ -1,23 +1,18 @@
// eslint-disable-next-line @typescript-eslint/no-use-before-define
-import React, { FC, useEffect, useState } from 'react';
import { Layout } from 'antd';
+import { FC, useEffect, useState } from 'react';
-import MainHeader from './MainHeader/MainHeader';
-import MainContent from './MainContent';
-import NoApp from './NoApp';
-import ChannelsBarService from 'app/features/channels/services/channels-bar-service';
-import { useWatcher } from 'app/deprecated/Observable/Observable';
import AccountStatusComponent from 'app/components/on-boarding/account-status-component';
import CompanyBillingBanner from 'app/components/on-boarding/company-billing-banner';
-import './MainView.scss';
+import useRouterChannel from 'app/features/router/hooks/use-router-channel';
import useRouterCompany from 'app/features/router/hooks/use-router-company';
import useRouterWorkspace from 'app/features/router/hooks/use-router-workspace';
-import useRouterChannel from 'app/features/router/hooks/use-router-channel';
-import MainViewService from 'app/features/router/services/main-view-service';
-import WindowState from 'app/features/global/utils/window';
-import { useCompanyApplications } from 'app/features/applications/hooks/use-company-applications';
-import { useChannel, useIsChannelMember } from 'app/features/channels/hooks/use-channel';
-import ContentRestricted from './ContentRestricted';
+import MainContent from './MainContent';
+import Search from './MainHeader/Search';
+import './MainView.scss';
+import CompanyHeader from '../channels-bar/Parts/CurrentUser/CompanyHeader/CompanyHeader';
+import CurrentUser from '../channels-bar/Parts/CurrentUser/CurrentUser';
+import Footer from '../channels-bar/Parts/Footer';
type PropsType = {
className?: string;
@@ -27,68 +22,17 @@ const MainView: FC = ({ className }) => {
const companyId = useRouterCompany();
const workspaceId = useRouterWorkspace();
const channelId = useRouterChannel();
- const { applications } = useCompanyApplications();
- const { channel, loading: channelLoading } = useChannel(channelId);
- const isChannelMember = useIsChannelMember(channelId);
-
- const loaded = useWatcher(ChannelsBarService, async () => {
- return (
- (await ChannelsBarService.isReady(companyId, workspaceId)) &&
- ChannelsBarService.isReady(companyId, 'direct')
- );
- });
- const ready = !(channelLoading && !channel) && loaded && !!companyId && !!workspaceId;
-
- const updateView = () => {
- if (channelId) {
- const app = applications.find(a => a.id === channelId);
- MainViewService.select(channelId, {
- app: app || {
- identity: {
- code: 'messages',
- name: '',
- icon: '',
- description: '',
- website: '',
- categories: [],
- compatibility: [],
- },
- },
- context: { type: app ? 'application' : 'channel' },
- hasTabs: channel?.visibility !== 'direct' && !app,
- });
- WindowState.setSuffix(channel?.name || app?.identity?.name);
- }
- };
-
- if (channelId && MainViewService.getId() !== channelId) updateView();
-
- if (
- ready &&
- !isChannelMember &&
- MainViewService.getViewType() === 'channel' &&
- channel?.visibility === 'private'
- ) {
- return (
- <>
-
-
-
-
- );
- }
return (
- {!!channelId && ready && (
- <>
-
- {companyId && }
-
-
-
- )}
- {!channelId && ready && }
+
+ {companyId && }
+
+
+
+
+
+
);
};
@@ -110,12 +54,5 @@ export const MainContentWrapper = () => {
};
export default ({ className }: PropsType) => {
- //This is a hack because main view is displayed before we detect the current "channel" is in fact an application
- const channelId = useRouterChannel();
- const { applications } = useCompanyApplications();
- const isChannelMember = useIsChannelMember(channelId);
-
- if (applications.length === 0 && !isChannelMember) return <>;
-
return ;
};
diff --git a/twake/frontend/src/app/views/client/side-bars.tsx b/twake/frontend/src/app/views/client/side-bars.tsx
index 94f7ced0..f1801e87 100755
--- a/twake/frontend/src/app/views/client/side-bars.tsx
+++ b/twake/frontend/src/app/views/client/side-bars.tsx
@@ -1,47 +1,24 @@
// eslint-disable-next-line @typescript-eslint/no-use-before-define
-import React from 'react';
import { Layout } from 'antd';
-import ChannelsBar, { LoadingChannelBar } from './channels-bar/ChannelsBar';
-import WorkspacesBar, { LoadingWorkspaceBar } from './workspaces-bar';
+import WorkspacesBar from './workspaces-bar';
-import { useWorkspaceLoader } from 'app/features/workspaces/hooks/use-workspaces';
-import useRouterCompany from 'app/features/router/hooks/use-router-company';
-import useRouterWorkspace from 'app/features/router/hooks/use-router-workspace';
import { useCurrentCompanyRealtime } from '../../features/companies/hooks/use-companies';
-import './workspaces-bar/styles.scss';
-import { usePreloadSomeUsers } from 'app/features/users/hooks/use-user-list';
import { useNotifications } from 'app/features/users/hooks/use-notifications';
+import { usePreloadSomeUsers } from 'app/features/users/hooks/use-user-list';
+import './workspaces-bar/styles.scss';
export default () => {
- const companyId = useRouterCompany();
- const workspaceId = useRouterWorkspace();
- const { loading } = useWorkspaceLoader(companyId);
useCurrentCompanyRealtime();
// We call this hook here to be able to preload some users in user list state
usePreloadSomeUsers();
useNotifications();
- if (loading) {
- return ;
- }
-
return (
- {!!workspaceId && }
- {!workspaceId && }
-
- );
-};
-
-export const LoadingSidebar = () => {
- return (
-
-
-
);
};