@webinex/chatify 2.0.0-alpha12 → 2.0.0-alpha14

package/src/core/constants.ts

@@ -1 +1 @@
-export const SYSTEM_ID = 'chatify::system';
+export const SYSTEM_ID = 'chatify::system';

package/src/core/debounce.ts

@@ -1,90 +1,90 @@
-interface DebounceInternalValue<T> {
-  value: T;
-  enqueueTime: number;
-}
-
-export interface DebounceValue<T> extends DebounceInternalValue<T> {
-  state: 'enqueued' | 'processing';
-}
-
-export interface DebounceConfig<T> {
-  timeout: number;
-  callback: (value: T) => Promise<any>;
-  groupBy: (value: T) => string;
-  compare: (a: T, b: T) => number;
-}
-
-export class Debounce<T> {
-  private _enqueued: DebounceInternalValue<T>[] = [];
-  private _processing: DebounceInternalValue<T>[] = [];
-  private _timeoutByGroup: Record<string, number> = {};
-  private _subscribers: ((value: Debounce<T>) => any)[] = [];
-
-  constructor(public config: DebounceConfig<T>) {}
-
-  public get units(): DebounceValue<T>[] {
-    return [
-      ...this._enqueued.map((x) => ({ ...x, state: 'enqueued' as const })),
-      ...this._processing.map((x) => ({ ...x, state: 'processing' as const })),
-    ];
-  }
-
-  public subscribe = (callback: (value: Debounce<T>) => any) => {
-    this._subscribers.push(callback);
-    return () => {
-      this._subscribers = this._subscribers.filter((x) => x !== callback);
-    };
-  };
-
-  public notify = () => {
-    this._subscribers.forEach((subscriber) => subscriber(this));
-  };
-
-  public push(value: T) {
-    const group = this.config.groupBy(value);
-    const unit = this._enqueued.find((unit) => this.config.groupBy(unit.value) === group);
-
-    if (!unit) {
-      this._enqueued.push({ value, enqueueTime: Date.now() });
-    } else if (this.config.compare(unit.value, value) >= 0) {
-      unit.value = value;
-      unit.enqueueTime = Date.now();
-    }
-
-    this._process(group);
-  }
-
-  private _process(group: string) {
-    if (!this._enqueued.some((unit) => this.config.groupBy(unit.value) === group)) {
-      return;
-    }
-
-    let timeout = this._timeoutByGroup[group];
-    timeout && clearTimeout(timeout);
-
-    if (this._processing.some((unit) => this.config.groupBy(unit.value) === group)) {
-      return;
-    }
-
-    timeout = setTimeout(() => {
-      const processing = this._enqueued.find((unit) => this.config.groupBy(unit.value) === group)!;
-      this._processing.push(processing);
-      this._enqueued.splice(this._enqueued.indexOf(processing), 1);
-      this.notify();
-
-      this.config
-        .callback(processing.value)
-        .then(() => {
-          this._processing.splice(this._processing.indexOf(processing), 1);
-          this.notify();
-          this._process(group);
-        })
-        .catch(() => {
-          this._processing.splice(this._processing.indexOf(processing), 1);
-          this.push(processing.value);
-        });
-    }, this.config.timeout);
-
-    this._timeoutByGroup[group] = timeout;
-  }
-}
+interface DebounceInternalValue<T> {
+  value: T;
+  enqueueTime: number;
+}
+
+export interface DebounceValue<T> extends DebounceInternalValue<T> {
+  state: 'enqueued' | 'processing';
+}
+
+export interface DebounceConfig<T> {
+  timeout: number;
+  callback: (value: T) => Promise<any>;
+  groupBy: (value: T) => string;
+  compare: (a: T, b: T) => number;
+}
+
+export class Debounce<T> {
+  private _enqueued: DebounceInternalValue<T>[] = [];
+  private _processing: DebounceInternalValue<T>[] = [];
+  private _timeoutByGroup: Record<string, number> = {};
+  private _subscribers: ((value: Debounce<T>) => any)[] = [];
+
+  constructor(public config: DebounceConfig<T>) {}
+
+  public get units(): DebounceValue<T>[] {
+    return [
+      ...this._enqueued.map((x) => ({ ...x, state: 'enqueued' as const })),
+      ...this._processing.map((x) => ({ ...x, state: 'processing' as const })),
+    ];
+  }
+
+  public subscribe = (callback: (value: Debounce<T>) => any) => {
+    this._subscribers.push(callback);
+    return () => {
+      this._subscribers = this._subscribers.filter((x) => x !== callback);
+    };
+  };
+
+  public notify = () => {
+    this._subscribers.forEach((subscriber) => subscriber(this));
+  };
+
+  public push(value: T) {
+    const group = this.config.groupBy(value);
+    const unit = this._enqueued.find((unit) => this.config.groupBy(unit.value) === group);
+
+    if (!unit) {
+      this._enqueued.push({ value, enqueueTime: Date.now() });
+    } else if (this.config.compare(unit.value, value) >= 0) {
+      unit.value = value;
+      unit.enqueueTime = Date.now();
+    }
+
+    this._process(group);
+  }
+
+  private _process(group: string) {
+    if (!this._enqueued.some((unit) => this.config.groupBy(unit.value) === group)) {
+      return;
+    }
+
+    let timeout = this._timeoutByGroup[group];
+    timeout && clearTimeout(timeout);
+
+    if (this._processing.some((unit) => this.config.groupBy(unit.value) === group)) {
+      return;
+    }
+
+    timeout = setTimeout(() => {
+      const processing = this._enqueued.find((unit) => this.config.groupBy(unit.value) === group)!;
+      this._processing.push(processing);
+      this._enqueued.splice(this._enqueued.indexOf(processing), 1);
+      this.notify();
+
+      this.config
+        .callback(processing.value)
+        .then(() => {
+          this._processing.splice(this._processing.indexOf(processing), 1);
+          this.notify();
+          this._process(group);
+        })
+        .catch(() => {
+          this._processing.splice(this._processing.indexOf(processing), 1);
+          this.push(processing.value);
+        });
+    }, this.config.timeout);
+
+    this._timeoutByGroup[group] = timeout;
+  }
+}

package/src/core/index.ts

@@ -1,4 +1,4 @@
-export * from './constants';
-export * from './types';
-export * from './api';
-export * from './client';
+export * from './constants';
+export * from './types';
+export * from './api';
+export * from './client';

package/src/core/types.tsx

@@ -1,182 +1,182 @@
-export interface Optional<TValue> {
-  hasValue: boolean;
-  value?: TValue | null;
-}
-
-export interface File {
-  name: string;
-  bytes: number;
-  ref: string;
-}
-
-export interface Period {
-  start: string;
-  end: string;
-}
-
-export interface AutoReply {
-  text: string;
-  period: Period;
-}
-
-export interface Account {
-  id: string;
-  name: string;
-  avatar: string;
-  autoReply: AutoReply | null;
-}
-
-export interface UpdateAccountRequest {
-  id: string;
-  autoReply?: Optional<AutoReply> | null;
-  name?: Optional<string> | null;
-  avatar?: Optional<string> | null;
-  active?: Optional<boolean> | null;
-}
-
-export interface MessageBase {
-  id: string;
-  text: string | null;
-  files: File[];
-  sentAt: string;
-  sentBy: Account;
-}
-
-export interface ChatMessage extends MessageBase {
-  chatId: string;
-}
-
-export interface Chat {
-  id: string;
-  name: string;
-  members: Account[];
-  active: boolean;
-  lastReadMessageId: string | null;
-}
-
-export interface ChatListItem {
-  id: string;
-  name: string;
-  message: ChatMessage;
-  totalUnreadCount: number;
-  active: boolean;
-  lastReadMessageId: string | null;
-}
-
-export interface SendChatMessageRequest {
-  chatId: string;
-  text: string | null;
-  files: File[];
-}
-
-export interface MessageBody {
-  text: string | null;
-  files: File[];
-}
-
-export interface AddChatRequest {
-  name: string;
-  message?: MessageBody;
-  members: string[];
-}
-
-export interface ReadChatMessageRequest {
-  id: string;
-}
-
-export interface ReadChatMessageEvent {
-  chatId: string;
-  newLastReadMessageId: string;
-  readCount: number;
-}
-
-export interface RemoveChatMemberRequest {
-  chatId: string;
-  accountId: string;
-  deleteHistory: boolean;
-}
-
-export interface AddChatMemberRequest {
-  chatId: string;
-  accountId: string;
-  withHistory: boolean;
-}
-
-export interface UpdateChatNameRequest {
-  id: string;
-  name: string;
-}
-
-export function chatId(messageId: string) {
-  return messageId.slice(0, 36);
-}
-
-export function messageSequencePart(id: string) {
-  return id.slice(37);
-}
-
-export interface ThreadWatchListItem {
-  id: string;
-  name: string;
-  createdById: string;
-  createdAt: string;
-  archive: boolean;
-  lastMessage: ThreadMessage | null;
-  lastReadMessageId: string | null;
-}
-
-export interface Thread {
-  id: string;
-  name: string;
-  createdBy: Account;
-  createdAt: string;
-  archive: boolean;
-  lastMessageId: string | null;
-  lastReadMessageId: string | null;
-  watch: boolean;
-}
-
-export interface ThreadMessage extends MessageBase {
-  threadId: string;
-}
-
-export interface SendThreadMessageRequest {
-  threadId: string;
-  body: MessageBody;
-}
-
-export interface ListSegment<T> {
-  items: T[];
-  total: number;
-}
-
-export type SystemMessageText =
-  | 'chatify://chat-created'
-  | 'chatify://member-added'
-  | 'chatify://member-removed'
-  | `chatify://chat-name-changed`;
-
-export function parseThreadMessageId(messageId: string) {
-  const [threadId, index] = messageId.split('::', 2);
-  return [threadId, parseInt(index, 10)] as const;
-}
-
-export function calcThreadUnreadCount(
-  thread: Pick<ThreadWatchListItem, 'lastMessage' | 'lastReadMessageId'>,
-) {
-  const lastReadMessageIndex =
-    thread.lastReadMessageId != null ? parseThreadMessageId(thread.lastReadMessageId)[1] : -1;
-
-  const lastThreadMessageIndex =
-    thread.lastMessage?.id != null ? parseThreadMessageId(thread.lastMessage?.id)[1] : -1;
-
-  return lastThreadMessageIndex - lastReadMessageIndex;
-}
-
-export function calcThreadListUnreadCount(
-  threads: Pick<ThreadWatchListItem, 'lastMessage' | 'lastReadMessageId'>[],
-) {
-  return threads.reduce((prev, thread) => {
-    return prev + calcThreadUnreadCount(thread);
-  }, 0);
-}
+export interface Optional<TValue> {
+  hasValue: boolean;
+  value?: TValue | null;
+}
+
+export interface File {
+  name: string;
+  bytes: number;
+  ref: string;
+}
+
+export interface Period {
+  start: string;
+  end: string;
+}
+
+export interface AutoReply {
+  text: string;
+  period: Period;
+}
+
+export interface Account {
+  id: string;
+  name: string;
+  avatar: string;
+  autoReply: AutoReply | null;
+}
+
+export interface UpdateAccountRequest {
+  id: string;
+  autoReply?: Optional<AutoReply> | null;
+  name?: Optional<string> | null;
+  avatar?: Optional<string> | null;
+  active?: Optional<boolean> | null;
+}
+
+export interface MessageBase {
+  id: string;
+  text: string | null;
+  files: File[];
+  sentAt: string;
+  sentBy: Account;
+}
+
+export interface ChatMessage extends MessageBase {
+  chatId: string;
+}
+
+export interface Chat {
+  id: string;
+  name: string;
+  members: Account[];
+  active: boolean;
+  lastReadMessageId: string | null;
+}
+
+export interface ChatListItem {
+  id: string;
+  name: string;
+  message: ChatMessage;
+  totalUnreadCount: number;
+  active: boolean;
+  lastReadMessageId: string | null;
+}
+
+export interface SendChatMessageRequest {
+  chatId: string;
+  text: string | null;
+  files: File[];
+}
+
+export interface MessageBody {
+  text: string | null;
+  files: File[];
+}
+
+export interface AddChatRequest {
+  name: string;
+  message?: MessageBody;
+  members: string[];
+}
+
+export interface ReadChatMessageRequest {
+  id: string;
+}
+
+export interface ReadChatMessageEvent {
+  chatId: string;
+  newLastReadMessageId: string;
+  readCount: number;
+}
+
+export interface RemoveChatMemberRequest {
+  chatId: string;
+  accountId: string;
+  deleteHistory: boolean;
+}
+
+export interface AddChatMemberRequest {
+  chatId: string;
+  accountId: string;
+  withHistory: boolean;
+}
+
+export interface UpdateChatNameRequest {
+  id: string;
+  name: string;
+}
+
+export function chatId(messageId: string) {
+  return messageId.slice(0, 36);
+}
+
+export function messageSequencePart(id: string) {
+  return id.slice(37);
+}
+
+export interface ThreadWatchListItem {
+  id: string;
+  name: string;
+  createdById: string;
+  createdAt: string;
+  archive: boolean;
+  lastMessage: ThreadMessage | null;
+  lastReadMessageId: string | null;
+}
+
+export interface Thread {
+  id: string;
+  name: string;
+  createdBy: Account;
+  createdAt: string;
+  archive: boolean;
+  lastMessageId: string | null;
+  lastReadMessageId: string | null;
+  watch: boolean;
+}
+
+export interface ThreadMessage extends MessageBase {
+  threadId: string;
+}
+
+export interface SendThreadMessageRequest {
+  threadId: string;
+  body: MessageBody;
+}
+
+export interface ListSegment<T> {
+  items: T[];
+  total: number;
+}
+
+export type SystemMessageText =
+  | 'chatify://chat-created'
+  | 'chatify://member-added'
+  | 'chatify://member-removed'
+  | `chatify://chat-name-changed`;
+
+export function parseThreadMessageId(messageId: string) {
+  const [threadId, index] = messageId.split('::', 2);
+  return [threadId, parseInt(index, 10)] as const;
+}
+
+export function calcThreadUnreadCount(
+  thread: Pick<ThreadWatchListItem, 'lastMessage' | 'lastReadMessageId'>,
+) {
+  const lastReadMessageIndex =
+    thread.lastReadMessageId != null ? parseThreadMessageId(thread.lastReadMessageId)[1] : -1;
+
+  const lastThreadMessageIndex =
+    thread.lastMessage?.id != null ? parseThreadMessageId(thread.lastMessage?.id)[1] : -1;
+
+  return lastThreadMessageIndex - lastReadMessageIndex;
+}
+
+export function calcThreadListUnreadCount(
+  threads: Pick<ThreadWatchListItem, 'lastMessage' | 'lastReadMessageId'>[],
+) {
+  return threads.reduce((prev, thread) => {
+    return prev + calcThreadUnreadCount(thread);
+  }, 0);
+}

package/src/index.ts

@@ -1,2 +1,2 @@
-export * from './ui';
-export * from './core';
+export * from './ui';
+export * from './core';

package/src/styles/aside.scss

@@ -1,26 +1,34 @@
-@use './variables.scss' as vars;
-@use './mixins.scss' as mixins;
-
-.wxchtf-aside {
-  flex: none;
-  display: flex;
-  flex-flow: column nowrap;
-  background: #ffffff;
-  border-top-left-radius: vars.$radius;
-  border-bottom-left-radius: vars.$radius;
-  padding-top: 15px;
-  width: 320px;
-  position: relative;
-  overflow: hidden;
-
-  &::before {
-    position: absolute;
-    content: '';
-    left: 0;
-    bottom: 0;
-    width: calc(100% - 10px);
-    height: 20px;
-    z-index: 1;
-    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
-  }
-}
+@use './variables.scss' as vars;
+@use './mixins.scss' as mixins;
+
+.wxchtf-chat-group.--compact {
+  .wxchtf-aside {
+    width: 100%;
+    border-top-right-radius: vars.$radius;
+    border-bottom-right-radius: vars.$radius;
+  }
+}
+
+.wxchtf-aside {
+  flex: none;
+  display: flex;
+  flex-flow: column nowrap;
+  background: #ffffff;
+  border-top-left-radius: vars.$radius;
+  border-bottom-left-radius: vars.$radius;
+  padding-top: 15px;
+  width: 320px;
+  position: relative;
+  overflow: hidden;
+
+  &::before {
+    position: absolute;
+    content: '';
+    left: 0;
+    bottom: 0;
+    width: calc(100% - 10px);
+    height: 20px;
+    z-index: 1;
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
+  }
+}