remove more liquid

_blog/2020-05-01-issue-1.md

@@ -22,7 +22,7 @@ There’s no other way to say it: solidarity is a struggle.
 
 Today, on May Day, what can any of us do to help our fellow workers win their demands? It’s a complicated question for any of us, [even in our own neighborhoods](https://itsgoingdown.org/autonomous-groups-are-mobilizing-mutual-aid-initiatives-to-combat-the-coronavirus/). It’s one thing to share mask-wearing tips, [DIY PPE resources](https://diyppe.us/), or even a [list of global and US grants for artists](https://www.booooooom.com/2020/03/20/covid-19-resources-for-artists/). It’s another thing to commit to working through things, together, especially with distances and divides between our communities and workplaces. The Reveal’s recent [podcast](https://www.revealnews.org/episodes/pandemic-protests-and-profits/) on COVID-19 in Amazon warehouses quotes one worker as saying, “Until Amazon and Jeff Bezos starts realizing there's real people that are going to die in his warehouse, that's not going to stop. And we need the customers to speak up. We can't do it alone.” Customer boycotts are part of the fight to support Amazon warehouse workers, and solidarity from other workers goes a long way, too.
 
-A handful of volunteer organizers in TWC have been talking with collectives of delivery and ride-hail drivers about ways to show our support and help one another. [Restarting this newsletter]({% link index.md %}) is one small way to organize ourselves in response. (You can subscribe [here](/subscribe)! But it’s not easy to pressure these powerful companies to treat their frontline workers better. One way tech workers and allies might be able to provide material support is by helping to simplify the process of [applying](https://www.wired.com/story/gig-workers-unemployment-benefits-wont-come-quickly/) for unemployment insurance. Another is to pressure tech companies – especially gig economy companies – to pay their workers what they’re owed, instead of allocating $110 million to fund a [counter-proposal](https://www.motherjones.com/coronavirus-updates/2020/04/protesting-uber-and-lyft-drivers-want-back-pay-and-more-coronavirus-protections/) that would 'guarantee' drivers [just $5.64/hr](https://laborcenter.berkeley.edu/the-uber-lyft-ballot-initiative-guarantees-only-5-64-an-hour/).
+A handful of volunteer organizers in TWC have been talking with collectives of delivery and ride-hail drivers about ways to show our support and help one another. [Restarting this newsletter]({% link index.11ty.tsx %}) is one small way to organize ourselves in response. (You can subscribe [here](/subscribe)! But it’s not easy to pressure these powerful companies to treat their frontline workers better. One way tech workers and allies might be able to provide material support is by helping to simplify the process of [applying](https://www.wired.com/story/gig-workers-unemployment-benefits-wont-come-quickly/) for unemployment insurance. Another is to pressure tech companies – especially gig economy companies – to pay their workers what they’re owed, instead of allocating $110 million to fund a [counter-proposal](https://www.motherjones.com/coronavirus-updates/2020/04/protesting-uber-and-lyft-drivers-want-back-pay-and-more-coronavirus-protections/) that would 'guarantee' drivers [just $5.64/hr](https://laborcenter.berkeley.edu/the-uber-lyft-ballot-initiative-guarantees-only-5-64-an-hour/).
 
 Learning about how we’re all connected and building relationships to make positive change across the industry is a slow but necessary process. This is why we need to stay in the struggle, together.
 

_data/press.yml

@@ -149,7 +149,7 @@
   date: 2018-03-01
 
 - media: Peninsula Press — Stanford Journalism
-  title: Tech workers organize to resist Trump"
+  title: Tech workers organize to resist Trump
   url: https://peninsulapress.com/2017/11/06/tech-workers-organize-to-resist-trump
   date: 2017-11-06
 

_includes/blog.11ty.tsx

@@ -0,0 +1,45 @@
+import { Data, EleventyFuns } from "../types.ts";
+
+export const render = async function (
+  this: EleventyFuns,
+  data: Data & { include?: { limit?: number } },
+) {
+  const {
+    include: { limit } = {},
+    page: { url },
+    collections: { blog },
+  } = data;
+
+  const items = blog.toSorted((a, b) => -(a.date.getTime() - b.date.getTime()));
+
+  const cards = await Promise.all(
+    items.slice(0, limit ?? items.length).map(
+      async (blog) =>
+        ({
+          type: "raw",
+          value: await this.renderFile("_includes/blog-card.html", {
+            ...data,
+            include: { blog },
+          }),
+        }) as const,
+    ),
+  );
+
+  return url === "/blog/" ? (
+    <>
+      <h1>Blog</h1>
+      Explore our <b>{items.length}</b> blog posts
+      <section>
+        <>{cards}</>
+      </section>
+    </>
+  ) : (
+    <>
+      <h2 class="marg-b-2">Blog Posts</h2>
+      {cards}
+      <a href="/blog" class="button">
+        See more blog posts
+      </a>
+    </>
+  );
+};

_includes/press.11ty.tsx

@@ -0,0 +1,45 @@
+import { DateTime } from "luxon";
+
+import { Data, EleventyFuns } from "../types.ts";
+
+export const render = async function (
+  this: EleventyFuns,
+  {
+    include: { limit } = {},
+    press,
+    site: { timeZone },
+    berlin_press,
+  }: Data & {
+    include?: { limit?: number };
+  },
+) {
+  const readDate = (x: string) =>
+    DateTime.fromFormat(x, "yyyy-MM-dd").setZone(timeZone);
+
+  const posts = [...press, ...berlin_press.filter((x) => x.lang === "en")].map(
+    ({ date, ...x }) => ({ ...x, date: readDate(date) }),
+  );
+  posts.sort((a, b) => -(a.date.toUnixInteger() - b.date.toUnixInteger()));
+
+  const icon = {
+    type: "raw",
+    value: await this.renderFile("_includes/icons/newspaper.html"),
+  };
+
+  return posts.slice(0, limit ?? posts.length).map((post) => (
+    <article class="card-preview">
+      <div class="icon">{icon}</div>
+      <div>
+        <div>
+          {post.media} —{" "}
+          <time datetime={post.date.setZone("UTC").toFormat("yyyy-MM-dd")}>
+            {post.date.setZone("UTC").toFormat("d LLLL yyyy")}
+          </time>
+        </div>
+        <h3>
+          <a href={post.url}>{post.title}</a>
+        </h3>
+      </div>
+    </article>
+  ));
+};

_layouts/event.11ty.tsx

@@ -1,13 +1,11 @@
 import { DateTime } from "luxon";
 
-import { Page } from "../types.ts";
+import { EleventyFuns, Page } from "../types.ts";
 
 export const data = { layout: "default.11ty.tsx" };
 
 export const render = function (
-  this: {
-    all_time_zones: (x: Date, timezones: string[]) => string;
-  },
+  this: EleventyFuns,
   {
     content,
     title,
@@ -53,7 +51,7 @@ export const render = function (
             </a>
           </div>
 
-          {{ type: "raw", value: content }}
+          <>{{ type: "raw", value: content }}</>
         </div>
       </article>
     </>

_layouts/newsletter.11ty.tsx

@@ -5,25 +5,10 @@ import { select } from "hast-util-select";
 import { toText } from "hast-util-to-text";
 import { DateTime } from "luxon";
 
-import { Page, Site } from "../types.ts";
+import { BlogItem, Page, Site } from "../types.ts";
 
 export const data = { layout: "default.11ty.tsx" };
 
-type BlogItem = {
-  data: {
-    image?:
-      | string
-      | {
-          file: string;
-          alt?: string;
-        };
-    title: string;
-  };
-  url: string;
-  date: Date;
-  content: string;
-};
-
 const BlogCard = async ({
   blog,
   timeZone,

blog.11ty.tsx

@@ -0,0 +1,8 @@
+import { EleventyFuns } from "./types.ts";
+
+export const render = async function (this: EleventyFuns, data: unknown) {
+  return {
+    type: "raw",
+    value: await this.renderFile("_includes/blog.11ty.tsx", data),
+  };
+};

eleventy.config.js

@@ -1,5 +1,6 @@
 import { pathToFileURL } from "node:url";
 
+import { RenderPlugin } from "@11ty/eleventy";
 import { feedPlugin } from "@11ty/eleventy-plugin-rss";
 import * as mdx from "@mdx-js/mdx";
 import { toHtml } from "hast-util-to-html";
@@ -67,6 +68,8 @@ export default async (cfg) => {
   cfg.addDataExtension("yml", YAML.parse);
   cfg.addDataExtension("yaml", YAML.parse);
 
+  cfg.addPlugin(RenderPlugin);
+
   const getRssConfig = (collection, name) => ({
     type: "atom",
     outputPath: `/feed/${collection}.xml`,
@@ -227,8 +230,13 @@ export default async (cfg) => {
         elementAttributeNameCase: "html",
       });
 
+      const funs = this.config.javascriptFunctions;
+
       return async function (data) {
-        const res = await mdxContent.call(this, data);
+        const res = await mdxContent({
+          ...data,
+          eleventy: funs,
+        });
         rehypeSlug({
           slugify: slugifyKramdown,
         })(res);

index.11ty.tsx

@@ -0,0 +1,89 @@
+import { EleventyFuns } from "./types.ts";
+
+export const data = {
+  permalink: "/",
+};
+
+export const render = async function (
+  this: EleventyFuns,
+  data: Record<string, unknown>,
+) {
+  return (
+    <>
+      <h1 class="leading-tight marg-b-2">
+        <span class="red">Worker</span> power in the{" "}
+        <span class="red">tech industry</span>
+      </h1>
+
+      {/* todo(maximsmol): add a banner/hero image to make this stand out even more */}
+      <div class="p-3 marg-b-2 secondaryBg">
+        <p>
+          Guided by our vision for an inclusive & equitable tech industry, TWC
+          organizes to build worker power through rank & file self-organization
+          and education.
+        </p>
+        <p>
+          We are a coalition of workers in and around the tech industry, labor
+          organizers, community organizers, and friends. We work in solidarity
+          with existing movements towards social justice, workers' rights, and
+          economic inclusion.
+        </p>
+        <p>
+          We’re a democratically structured, all-volunteer, and worker-led
+          organization.
+        </p>
+      </div>
+      <nav style="font-size: clamp(0.875rem, 0.7216rem + 0.6818vw, 1.25rem)">
+        <ul>
+          <li>
+            <a href="/subscribe" class="button primary">
+              Get Involved
+            </a>
+          </li>
+          <li>
+            <a href="/chapters" class="button">
+              Find a Local Chapter
+            </a>
+          </li>
+        </ul>
+      </nav>
+
+      <section>
+        {{
+          type: "raw",
+          value: await this.renderFile("_includes/events.html", {
+            ...data,
+            include: { limit: 5 },
+          }),
+        }}
+      </section>
+
+      <section>
+        {{
+          type: "raw",
+          value: await this.renderFile("_includes/blog.11ty.tsx", {
+            ...data,
+            include: { limit: 3 },
+          }),
+        }}
+      </section>
+
+      <section>
+        <h2>TWC in the Press</h2>
+        <>
+          {{
+            type: "raw",
+            value: await this.renderFile("_includes/press.11ty.tsx", {
+              ...data,
+              include: { limit: 2 },
+            }),
+          }}
+        </>
+
+        <a href="/press" class="button">
+          See more press mentions
+        </a>
+      </section>
+    </>
+  );
+};

press.md → press.mdx

@@ -2,8 +2,8 @@
 title: Press
 ---
 
-<h1 class="marg-b-4">{{title}}</h1>
+<h1 class="marg-b-4">{props.title}</h1>
 
 If you’re a member of the press, please get in touch with us through <a href="mailto:press@techworkerscoalition.org">press@techworkerscoalition.org.</a>
 
-{% include press.html %}
+{{ type: "raw", value: await props.eleventy.renderFile("_includes/press.11ty.tsx", props) }}