Function UsersTyping

apps/web/ui/Thread/UsersTyping.tsx:6–35

({
  currentUser,
  ...rest
}: {
  usersTyping: string[];
  currentUser?: SerializedUser | null;
})

const typingTimeout = 2000;

export function UsersTyping({
  currentUser,
  ...rest
}: {
  usersTyping: string[];
  currentUser?: SerializedUser | null;
}) {
  const usersTyping = useMemo(
    () => rest.usersTyping.filter((u) => u !== currentUser?.displayName),
    [rest.usersTyping, currentUser]
  );

  if (!usersTyping.length) {
    return <></>;
  }

  const isAre = usersTyping.length === 1 ? 'is' : 'are';
  return (
    <span
      style={{
        fontSize: 'small',
        fontStyle: 'italic',
        color: 'var(--color-gray-400)',
        position: 'absolute',
      }}
    >
      {usersTyping.join(', ')} {isAre} typing...
    </span>
  );
}

export function TypingFunctions({
  isUserTyping,