pleshevski.ru/views/pages/works.ts

import { PageLayout } from "../comp/page_layout.ts";
import { AnyNode, E } from "ren/node.ts";
import { classNames } from "ren/attrs.ts";
import { Context } from "../../context.ts";
import { H3 } from "../uikit/typo.ts";
import { Link, RepoLink } from "../uikit/link.ts";

const tr = E.bind(null, "tr", []);
const td = E.bind(null, "td", []);
const th = E.bind(null, "th", []);

export function WorksPage(ctx: Context): AnyNode {
  return PageLayout(ctx, [
    E("div", classNames("content-width gap-v-1x5 responsive-typography"), [
      H3(ctx.tr.Chronological),
      ChronologicalWorksTable([
        {
          name: RepoLink("paren", "/pleshevskiy/paren"),
          description: "Library for parsing and rendering information.",
          roles: [Role.Author],
          technologies: [Technology.TypeScript, Technology.Deno],
          start: "2022",
          statuses: [Status.ActiveDeveloped, Status.Experimental],
        },
        {
          name: RepoLink("hwt", "//github.com/pleshevskiy/hwt"),
          description:
            "healthy workaholic timer – A tool that keeps you from breaking your health by working all day.",
          roles: [Role.Author],
          technologies: [Technology.Rust],
          start: "2022",
          statuses: [Status.ActiveDeveloped],
        },
        {
          name: RepoLink("migra", "//github.com/pleshevskiy/migra"),
          description: "Simple SQL migration manager for your project.",
          roles: [Role.Author],
          technologies: [Technology.Rust],
          start: "2021",
          statuses: [Status.AsIs],
        },
        {
          name: RepoLink(
            "ood_persistence",
            "//github.com/pleshevskiy/ood_persistence",
          ),
          description:
            "Asynchronous and synchronous interfaces and persistence implementations for your OOD architecture ",
          roles: [Role.Author],
          technologies: [Technology.Rust],
          start: "2021",
          statuses: [Status.Deprecated, Status.Experimental],
        },
        {
          name: RepoLink(
            "espruino-starter",
            "//github.com/pleshevskiy/espruino-starter",
          ),
          description:
            "Quickly start creating your new project on the espruino board or a board based on it.",
          roles: [Role.Author],
          technologies: [Technology.JavaScript],
          start: "2021",
          statuses: [Status.AsIs],
        },
        {
          name: RepoLink(
            "sonic-channel",
            "//github.com/pleshevskiy/sonic-channel",
          ),
          description: "Rust client for sonic search backend.",
          roles: [Role.Author],
          technologies: [Technology.Rust],
          start: "2020",
          statuses: [Status.PassivelyMaintained],
        },
        {
          name: RepoLink(
            "react-rest-request",
            "//github.com/pleshevskiy/react-rest-request",
          ),
          description:
            "Minimalistic REST API client for React inspired by Apollo.",
          roles: [Role.Author],
          technologies: [Technology.TypeScript, Technology.React],
          start: "2020",
          statuses: [Status.AsIs],
        },
        {
          name: RepoLink("itconfig", "/pleshevskiy/itconfig"),
          description:
            "Easy build a configs from environment variables and use it in globally.",
          roles: [Role.Author],
          technologies: [Technology.Rust],
          start: "2019",
          statuses: [Status.PassivelyMaintained],
        },
        {
          name: Link("Cabinet Master Progress", {
            href: "https://cabinet.masterprogress.ru",
          }),
          description:
            "Student's cabinet of the educational center Master Progress (SSR + SPA)",
          roles: [Role.TechLead],
          technologies: [Technology.Python, Technology.Flask, Technology.React],
          start: "2019",
          statuses: [Status.PassivelyMaintained],
        },
        {
          name: Link("Master Progress", { href: "https://masterprogress.ru" }),
          description:
            "Main website of the educational center Master Progress (SSR + Forms)",
          roles: [Role.TechLead],
          technologies: [Technology.Python, Technology.Flask],
          start: "2018",
          statuses: [Status.PassivelyMaintained],
        },
        {
          name: RepoLink("ictmpl", "//github.com/pleshevskiy/ictmpl"),
          description: "Generate projects from templates",
          roles: [Role.Author],
          technologies: [Technology.Python],
          start: "2018",
          statuses: [Status.AsIs],
        },
        {
          name: RepoLink("jjcrypto", "//github.com/pleshevskiy/ictmpl"),
          description: "Javascript encoder and decoder",
          roles: [Role.Author],
          technologies: [Technology.Php],
          start: "2015",
          statuses: [Status.AsIs],
        },
      ]),
    ]),
  ]);
}

function ChronologicalWorksTable(works: Work[]): AnyNode {
  return E("table", [], [
    E("thead", [], [
      tr([
        th("Name"),
        th("Description"),
        th("Role"),
        th("Stack"),
        th("Start"),
        th("Status"),
      ]),
    ]),
    E(
      "tbody",
      [],
      works.map((work) => {
        return tr([
          td([work.name]),
          td(work.description),
          td(work.roles.join(", ")),
          td(work.technologies.join(", ")),
          td(work.start),
          td(work.statuses.join(", ")),
        ]);
      }),
    ),
  ]);
}

interface Work {
  name: AnyNode;
  description: string;
  roles: Role[];
  technologies: Technology[];
  start: string;
  statuses: Status[];
}

enum Role {
  Author = "author",
  TechLead = "tech lead",
}

enum Technology {
  JavaScript = "JS",
  TypeScript = "TS",
  Rust = "Rust",
  Python = "Python",
  Php = "PHP",
  Deno = "Deno",
  NodeJS = "NodeJS",
  Flask = "Flask",
  React = "React",
}

enum Status {
  // New features are being added and bugs are being fixed.
  ActiveDeveloped = "actively-developed",

  // There are no plans for new features, but the maintainer intends to respond
  // to issues that get filed.
  PassivelyMaintained = "passively-maintained",

  // The package is feature complete, the maintainer does not intend to continue
  // working on it or providing support, but it works for the purposes it was
  // designed for.
  AsIs = "as-is",

  // The author wants to share it with the community but is not intending to
  // meet anyone's particular use case.
  Experimental = "experimental",

  // The current maintainer would like to transfer the package to someone else.
  LookingForMaintainer = "looking-for-maintainer",

  // The maintainer does not recommend using this package (the description of the
  // package can describe why, there could be a better solution available or
  // there could be problems with the package that the author does not want to fix).
  Deprecated = "deprecated",
}