@webinex/chatify 1.0.2-rc3 → 2.0.0-alpha1

package/src/ui/CreateChatPanel/CreateChatPanel.tsx

@@ -1,33 +0,0 @@
-import { useAddChatMutation } from '../../core';
-import { useCallback } from 'react';
-import { uniqId } from '../../util';
-import { useLocalizer } from '../localizer';
-import { CreateChatForm, CreateChatFormValue } from './CreateChatForm';
-import { customize } from '../customize';
-
-function useSubmit() {
-  const [add, { isFetching }] = useAddChatMutation();
-  const onSubmit = useCallback(
-    (value: CreateChatFormValue) =>
-      add({
-        name: value.name,
-        members: value.members,
-        requestId: uniqId(),
-      }),
-    [add],
-  );
-
-  return [onSubmit, isFetching] as const;
-}
-
-export const CreateChatPanel = customize('CreateChatPanel', () => {
-  const localizer = useLocalizer();
-  const [onSubmit, submitting] = useSubmit();
-
-  return (
-    <div className="wxchtf-create-chat">
-      <h3>{localizer.addChat.title()}</h3>
-      <CreateChatForm busy={submitting ?? false} onSubmit={onSubmit} />
-    </div>
-  );
-});

package/src/ui/CreateChatPanel/index.ts

@@ -1,4 +0,0 @@
-export * from './CreateChatForm';
-export * from './CreateChatMemberInput';
-export * from './CreateChatNameInput';
-export * from './CreateChatPanel';

package/src/ui/InputBox/InputBox.tsx

@@ -1,38 +0,0 @@
-import { useCallback, useState } from 'react';
-import { useSelect, useSendMutation } from '../../core';
-import { uniqId } from '../../util';
-import { InputFilesBox } from './InputFilesBox';
-import { InputTextBox } from './InputTextBox';
-import { customize } from '../customize';
-import { InputSubmitButtonBox } from './InputSubmitButtonBox';
-
-function useSend(text: string, setText: (value: string) => void) {
-  const chatId = useSelect((x) => x.ui.chatId!, []);
-  const [add] = useSendMutation();
-
-  return useCallback(() => {
-    if (text.length === 0) {
-      return;
-    }
-
-    setText('');
-    add({ chatId, text: text, files: [], requestId: uniqId() });
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [chatId, text]);
-}
-
-export const InputBox = customize('InputBox', () => {
-  const [text, setText] = useState('');
-  const onSend = useSend(text, setText);
-
-  return (
-    <div className="wxchtf-input-form">
-      <div className="wxchtf-input-box">
-        <InputFilesBox />
-        <InputTextBox value={text} onSend={onSend} onChange={setText} />
-        <InputSubmitButtonBox onSubmit={onSend} />
-      </div>
-    </div>
-  );
-});

package/src/ui/InputBox/index.ts

@@ -1,4 +0,0 @@
-export * from './InputBox';
-export * from './InputFilesBox';
-export * from './InputSubmitButtonBox';
-export * from './InputTextBox';

package/src/ui/Layout/Aside.tsx

@@ -1,10 +0,0 @@
-import { customize } from '../customize';
-import { ChatList } from '../ChatList';
-
-export const Aside = customize('Aside', () => {
-  return (
-    <div className="wxchtf-aside">
-      <ChatList />
-    </div>
-  );
-});

package/src/ui/Layout/Body.tsx

@@ -1,10 +0,0 @@
-import { customize } from '../customize';
-import { Aside } from './Aside';
-import { Main } from './Main';
-
-export const Body = customize('Body', () => (
-  <div className="wxchtf-body">
-    <Aside />
-    <Main />
-  </div>
-));

package/src/ui/Layout/Footer.tsx

@@ -1,3 +0,0 @@
-import { customize } from '../customize';
-
-export const Footer = customize('Footer', () => <div className="wxchtf-footer"></div>);

package/src/ui/Layout/Header.tsx

@@ -1,10 +0,0 @@
-import { AddChatButton } from '../AddChatButton';
-import { customize } from '../customize';
-
-export const Header = customize('Header', () => {
-  return (
-    <div className="wxchtf-header">
-      <AddChatButton />
-    </div>
-  );
-});

package/src/ui/Layout/Main.tsx

@@ -1,15 +0,0 @@
-import { useSelect } from '../../core';
-import { customize } from '../customize';
-import { CreateChatPanel } from '../CreateChatPanel';
-import { ChatPanel } from '../ChatPanel';
-
-export const Main = customize('Main', () => {
-  const { view, chatId } = useSelect((x) => ({ view: x.ui.view, chatId: x.ui.chatId }), []);
-
-  return (
-    <div className="wxchtf-main">
-      {view === 'chat' && chatId && <ChatPanel id={chatId} key={chatId} />}
-      {view === 'new-chat' && <CreateChatPanel />}
-    </div>
-  );
-});

package/src/ui/Layout/index.ts

@@ -1,5 +0,0 @@
-export * from './Aside';
-export * from './Header';
-export * from './Footer';
-export * from './Main';
-export * from './Body';

package/src/ui/Message/index.ts

@@ -1,6 +0,0 @@
-export * from './MessageAuthor';
-export * from './MessageBox';
-export * from './MessageContent';
-export * from './MessageInfoBox';
-export * from './MessageRow';
-export * from './MessageText';

package/src/ui/SendingMessage/index.ts

@@ -1,4 +0,0 @@
-export * from './SendingMessageBox';
-export * from './SendingMessageContent';
-export * from './SendingMessageInfoBox';
-export * from './SendingMessageText';

package/src/ui/SystemMessage/SystemMessageRow.tsx

@@ -1,43 +0,0 @@
-import { Ref } from 'react';
-import { customize } from '../customize';
-import { Localizer, useLocalizer } from '../localizer';
-import { Message } from '../../core';
-
-export interface SystemMessageRowProps {
-  message: Message;
-  containerRef?: Ref<HTMLDivElement>;
-}
-
-export function formatSystemMessage(localizer: Localizer, text: string): React.ReactNode {
-  if (text === 'chatify://chat-created') {
-    return localizer.system.chatCreated();
-  }
-
-  if (text.startsWith('chatify://member-added')) {
-    return localizer.system.memberAdded();
-  }
-
-  if (text.startsWith('chatify://member-removed')) {
-    return localizer.system.memberRemoved();
-  }
-
-  if (text.startsWith('chatify://chat-name-changed::')) {
-    const data = JSON.parse(text.substring('chatify://chat-name-changed::'.length));
-    return localizer.system.chatNameChanged(data.newName);
-  }
-
-  return text;
-}
-
-export const SystemMessageRow = customize('SystemMessageRow', (props: SystemMessageRowProps) => {
-  const { message, containerRef } = props;
-  const { text, sentAt } = message;
-  const localizer = useLocalizer();
-
-  return (
-    <div ref={containerRef} className="wxchtf-system-message">
-      <div className="wxchtf-text">{formatSystemMessage(localizer, text)}</div>
-      <div className="wxchtf-timestamp">{localizer.timestamp(sentAt)}</div>
-    </div>
-  );
-});

package/src/ui/SystemMessage/index.ts

@@ -1,2 +0,0 @@
-export * from './SystemMessageBox';
-export * from './SystemMessageRow';

package/src/util/index.ts

@@ -1,2 +0,0 @@
-export * from './uniqBy';
-export * from './uniqId';

package/src/util/uniqBy.tsx

@@ -1,17 +0,0 @@
-export function uniqBy<T, TKey extends string | number | symbol>(items: T[], selector: (x: T) => TKey) {
-  const keys = {} as Record<TKey, null>;
-  const result: T[] = [];
-
-  items.forEach((x) => {
-    const key = selector(x);
-
-    if (keys.hasOwnProperty(key)) {
-      return;
-    }
-
-    keys[key] = null;
-    result.push(x);
-  });
-
-  return result;
-}

package/src/util/uniqId.tsx

@@ -1,3 +0,0 @@
-export function uniqId() {
-  return Date.now().toString(36) + Math.random().toString(36).substring(2);
-}