import { Template } from '@/mission-control';

import { Board, Post, RecentPost } from '~/db/models';
import { truncate } from '~/util/truncate';

import Header from './Header';

interface Props {
  posts: Array<RecentPost>;
  boards: Array<Board>;
}

const date = (post: Post) => {
  return post.createdAt.split(' ')[0];
};

const SPACE = '​';
const LENGTH = 160;

const comment = (post: Post) => {
  const text = post.comment
    .replace(/\n/g, ' ')
    .replace(/ */, ' ')
    .replaceAll(SPACE, '')
    .trim();
  return truncate(text, LENGTH);
};

const Entry: Template<{ post: RecentPost }> = (_, { post }) => {
  if (post.comment === '[Image]') {
    const replyTo = truncate(post.threadComment.split('\n')[0], 30);
    post.comment = `[Image reply in: ${replyTo}]`;
  }

  return `
=> /posts/${post.id} ${date(post)} ${comment(post)}
`;
};

const FeedPage: Template<Props> = ({ each, include }, { boards, posts }) => `
${include(Header)}

## Recent posts on ${boards.map(({ name }) => `/${name}/`).join(', ')}

${each(posts, (post) => include(Entry, { post }))}
`;

export default FeedPage;