<section id="app"></section>
import React, { FC, useState } from "https://esm.sh/react@18.2.0";
import ReactDOM from "https://esm.sh/react-dom@18.2.0";

interface Content {
  key: string;
  title: string;
  site: {
    key: string;
    title: string;
  };
  timestamp: number;
}

const PER_PAGE = 20;
const DATA = [
  {
    key: "3e7da1a568270e9b86ff35b225cbcf2323bc47ba552cdf2ccccbf385b148a06b",
    title: "Lorena Wiebes: Winning for fun",
    site: {
      key: "81611e245f65d077f099142effb2f79b4493b7830317401bc63152f69a7ef45d",
      title: "Rouleur - Rouleur: Inside the peloton"
    },
    timestamp: 1667841276
  },
  {
    key: "849446ee54492e7caf57bb2ceb39253fa1d0f684b1c1b815f697f51731200150",
    title:
      "Deals: Amazon Has AirPods Pro 2 for $234 ($15 Off) and Cellular Apple Watch Series 8 for $389 ($110 Off)",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667841251
  },
  {
    key: "7f2be4520753637b3beefe8577284b5dcb6a8dd64021d70cafffe9a8f65fb4f3",
    title:
      "10 new tech highlights from Bianchi, Ribble, Kask, Giro, Schwalbe and more",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667840404
  },
  {
    key: "9eed018c67b1e18158670545b1512ac1744a4a121ba690dfcb9e7da8cff708a7",
    title: "Celebrating Mixed Identities with the Hashi:Blend ERG",
    site: {
      key: "5aaceb7f7b6e9338bc7d480700351899e4f1e552fbdf8426fb3791c210653b44",
      title: "HashiCorp Blog"
    },
    timestamp: 1667840400
  },
  {
    key: "78dbf1c796916ecae7ffb6541baf41442e95529c33b4bd9cf5f27470af0c2815",
    title: "The Boring Company ประกาศเริ่มการทดสอบ Hyperloop ขนาดเท่าของจริง",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667840247
  },
  {
    key: "3e8aae8e1e06ef67d394853189eceb124def9221a31f76e0a6ee5a946d483e99",
    title: "Apple Preparing iOS 16.1.1 as Widespread Wi-Fi Bug Persists",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667840137
  },
  {
    key: "d0292574b4c0b147639bf2b94cdf5b387ce1e8948e9c66cb5261eb112dd30a50",
    title: "Best iPad Pro deals right now",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667839520
  },
  {
    key: "65aaee1334e87e2a5f40406fd58157b0cba8a82bc5a63fb9d5b09da0a5c6f41a",
    title: "Freewheeling: Changing roles and changing teams",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667839408
  },
  {
    key: "e9937c07f3a199266f5fabb238ac889675a4d5a70a299bd53949828a71eb8b41",
    title: "Cherry เปิดตัวสวิตช์ MX Black Clear-Top สัมผัสคอมพิวเตอร์ยุค 80s",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667838988
  },
  {
    key: "57d68fa70691c56d57f567c029cec6aa9b983c9a0c684ad62edb6f866d42dd7b",
    title:
      "‘I didn’t dare to lose’ Demi Vollering on dealing with disappointment, shouldering pressure and the 2023 Tour de France Femmes route",
    site: {
      key: "81611e245f65d077f099142effb2f79b4493b7830317401bc63152f69a7ef45d",
      title: "Rouleur - Rouleur: Inside the peloton"
    },
    timestamp: 1667838888
  },
  {
    key: "564d849e3541af8b491b452d90353a2fdf3add19590ec39ba56c50276fdbdaee",
    title:
      "Best Apple deals this month: Mac, iPad, AirPods, Apple Watch, and more",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667838854
  },
  {
    key: "735a898ef31e8c2f1804e9b231f952a4a394a27ac56531f137795f8584979c2d",
    title:
      "Chinese COVID-19 Restrictions Now Affecting Shipments of iPhones 14 Pro and Pro Max",
    site: {
      key: "8b0558b7511628eecfb3548688483a3ecf017b5cea6c3751b1e258b18a0d1837",
      title: "Daring Fireball"
    },
    timestamp: 1667838725
  },
  {
    key: "01907ef01721f80f62c51208347a15b0e78cfe23463d07cffaadc01293074aad",
    title:
      "Muoverti Rebrands to MUOV, Unveils Rocking Indoor Time Trial/Triathlon Bike",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667837809
  },
  {
    key: "73161a2b7f44f569dbad2e5eee6bec1013adbc632ece8ac4dc6f1e874010d3da",
    title:
      "Radar Roundup: New Widefoot Liter Cage, Equipt Sardine Tool, Panorama Cycles Recycles Carbon, Limited Editon BSA Wheels MFG BB, A Few Thousand Hours, and Ronnie Talks Alumalith",
    site: {
      key: "b88b01d657c7f925c05d345a3208db369e9b777c5321c992ae8cf9e0f6010c3a",
      title: "The Radavist"
    },
    timestamp: 1667836331
  },
  {
    key: "bd0c05f8db39d4f2e0c7878c2cfab6e88605d4ee366456c820592da61c4ff4d8",
    title:
      "Win the Same Bike Braydon Bringhurst Used to Climb UP All 8600′ of The Whole Enchilada!",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667836231
  },
  {
    key: "0955065a6fb0e8d1e5b518f41b4745f18600f13d8e6c9b71fb3fb83f82786d9a",
    title:
      "Take $500 off the 10-core MacBook Pro in this incredible early Black Friday sale",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667836194
  },
  {
    key: "0056c6cff6cfed3e7e2f737f5283e070eac396032c491eedde6c572d7d14c4ae",
    title: "Chinese chip designers slow down processors to dodge US sanctions",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667835828
  },
  {
    key: "aba8e99ef99d54deab9f940306fdf9b13c9c503eef0b0d08f42669a300034268",
    title:
      "Alibaba Cloud ถอนผลทดสอบ SPEC ของชิป Yitian 710 หลังประสบปัญหายังให้บริการเต็มรูปแบบไม่ได้",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667835030
  },
  {
    key: "ffcdbd483bcfa704fa1841df69356cb627c87f9f91acb1ad531b469c41aa872b",
    title:
      "Musk-led Twitter laid off some employees by mistake, asks them to come back",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667834982
  },
  {
    key: "acb0ed85dc115d530ce609defd07598d6576b646632808885da8f5e41a285c74",
    title: "AMD บอกคู่แข่งของ Radeon 7900 XTX คือ GeForce 4080 ไม่ใช่ 4090",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667834710
  },
  {
    key: "373ea6cc49b8273700847a4b512d0cd8940d6ff6687c4e6b59a3064ac0e2910f",
    title: "Rapha launches new Gore-Tex Brevet jersey that’s arguably a jacket",
    site: {
      key: "1eccc14e20fb45d0941026ceb8520f9680685bfb08ad8c07e4a6d113a0432f0e",
      title: "Cyclist.co.uk"
    },
    timestamp: 1667832832
  },
  {
    key: "cb84ac6b5c9a27b1747f5821decc24dcc202e32b95c2a271ec41413d93cb6b1c",
    title:
      "Deals: Amazon Introduces Massive Discounts on 2021 MacBook Pros, Save Up to $499",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667832256
  },
  {
    key: "6537419dfb74f9835599174ec5e4f8fccede47e179a0cd1e80275041aa85329b",
    title: "What’s New In Next.js 13?",
    site: {
      key: "208bbc767f397995c4779d8a6d3021e4665173e1ece89688676db85af6112329",
      title: "Articles on Smashing Magazine — For Web Designers And Developers"
    },
    timestamp: 1667829600
  },
  {
    key: "001ce37f0920798fddd54bea8a62dadfd7f24ac1f932298ec4b59ebbb1b7b577",
    title: "Must Watch: Joe and Bo’s Bedtime Stories",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667828769
  },
  {
    key: "5a63d836b34861b0a367172e11ed10fa776b296f1641bc3001ab90f8ba429eb1",
    title:
      "The win of the season? Matej Mohorič reflects on how he won Milan-Sanremo",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667827430
  },
  {
    key: "723a5b3adfd4101b95bd852c46f86a3b6e290d995c01d92c69ef9a57acbd1749",
    title: "What to expect from Black Friday iPad deals",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667826530
  },
  {
    key: "6b288fe051fd1dc945df676f738120cd22c0996d776f8ff5ea65b680e6f7f03d",
    title: "iPad (10th generation) review: A beautiful disappointment",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667826404
  },
  {
    key: "71067ad33c1a45010da0b794c467820475c4d21da98512374b4f8d6c70432548",
    title: "Unity เสร็จสิ้นการควบรวมกับบริษัทโฆษณา ironSource",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667826090
  },
  {
    key: "f787e43bfad9f52d18874427449914e902a5c583b325e02d598ecbf01819aaa3",
    title: "What to expect from Black Friday iPhone deals",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667825252
  },
  {
    key: "cfb9d82120bf3d3e5a8bdb272742d0dbe1807195edfdf95de38180321c4da83e",
    title:
      "Phil Spencer ยกย่อง StarCraft อยากไปคุยกับทีม Blizzard ว่ามีโอกาสทำเกมอะไรต่อได้บ้าง",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667822955
  },
  {
    key: "f3aadf0c913dd18d66a3922a4a11d7c7c1e0a830883ce5f0afb46ba7faa8c777",
    title: "Chris Corona’s MASH SF Rockbanger Hardtail MTB – Chris Corona",
    site: {
      key: "b88b01d657c7f925c05d345a3208db369e9b777c5321c992ae8cf9e0f6010c3a",
      title: "The Radavist"
    },
    timestamp: 1667822454
  },
  {
    key: "f350a4b2004d0e67573f890592055e36c64e9d2c2843cfd336165a5ce35c2f7c",
    title: "Megalodon and other extinct giant sharks started life in nurseries",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667822427
  },
  {
    key: "72a5cf5459e9a2dc59c895e6e31d646a370fcc6cca5e27a6b7bbff28acf17499",
    title: "The best Apple TV deals available now",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667822081
  },
  {
    key: "997265d7b6ffb684f33482d5d174473f463a2eb20bcf04560fad8a290f712e36",
    title:
      "Apple Issues Takedown Order for Popular YouTube Channel That Archived WWDC Keynotes",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667821189
  },
  {
    key: "6c8e54711fcc4d353797b4afbc6926224e4d6a5fe9e79103b47e2e95d61cbfc2",
    title:
      "แฮกเกอร์โจมตีคนเล่นคริปโต ดักตรวจข้อมูล clipboard ถ้าพบ Wallet Adress จะเปลี่ยนเป็นของคนร้าย",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667818920
  },
  {
    key: "5de226e0c1762d3d2ae4e62269293e8b57350961db0dc6a7ad0e0aa4bc2414a1",
    title: "Should I shut down my Mac every night?",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667818737
  },
  {
    key: "01d72d72964096cad6ea4a69eb20ba4d6668cdf34d2f13778cd80dc3f072fe4f",
    title: "Even with record profits, Apple can’t buy our trust",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667817000
  },
  {
    key: "d0c94c516b9d9ad522b6b874fbd2664aa6edd740b8027996a5dc6d43fe3d386a",
    title:
      "ไมโครซอฟท์ออกรายงานการโจมตีไซเบอร์ปี 2022 พบชาตินาโต้ถูกโจมตีโครงสร้างสำคัญเพิ่มขึ้น แฮกเกอร์จีนใช้ zero-day มากขึ้น",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667816889
  },
  {
    key: "b679da4b77a454e3ffc919e9cfe001aa6fab304d8fd120034e80267bd1786105",
    title:
      "Best MagSafe portable battery packs and power banks for iPhone 12, 13 and 14",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667815500
  },
  {
    key: "3a72d1d8da87f2ffe7ae0f4b933317269e9f32abc2efa5b40d80438103ee248a",
    title: "Apple is reportedly working on a big Siri change nobody asked for",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667813925
  },
  {
    key: "7ee372fd20b1c0eff0dc85dfe178c18ae071524340853fe58fef63d250bca8ec",
    title:
      "PowerPhotos 2.1 review: Brings even more power to Photos library management",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667811600
  },
  {
    key: "103c96bb11e98a6738b22fc8386cc0de4bf0098da771e67f63cc5899663d6434",
    title: "Supercharge your Mac with three top-rated apps for just $20",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667808000
  },
  {
    key: "e38f1201670947a33d06cd8ad516d3ca741894d39eeb3cfe4f75ba241bbf86ce",
    title:
      "หลายบริษัทเลิกใช้หุ่นยนต์ส่งของและเสิร์ฟอาหาร ตั้งคำถามคุ้มกับต้นทุนไหม",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667802511
  },
  {
    key: "7d27cfb5b1b36fe9e9e24b719ba7fbebf3c7fc7facd23da9ec73a87fd84d4238",
    title: "Bikerumor Pic Of The Day: Dundee, Wisconsin",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667797280
  },
  {
    key: "97f0db65fb7881e5eb0534bdda7d75573f53003b624dfcd40a5e1734f5a44a25",
    title:
      "Elon Musk เปลี่ยนกฎใหม่ ระงับบัญชี Twitter ที่ปลอมเป็นบุคคลอื่นถาวร หลังมีคนปลอมเป็นตัวเอง",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667792628
  },
  {
    key: "635359ad1cb835252fc58e38ebc7bfd54499bd2a323f975418b7a2e0e51cfe88",
    title:
      "โมเดลธุรกิจใหม่อินเทล Xeon รุ่นหน้าจะรองรับการจ่ายเงินเพื่อปลดล็อคฟีเจอร์ในซีพียูได้",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667791576
  },
  {
    key: "1795552c4d966107f148ac3202ec880a3f41a12cd077d107e1501b4230e813b7",
    title:
      "ไมโครซอฟท์ประกาศรีมาสเตอร์ Age of Mythology Retold, ออก Age of Empires Mobile",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667787571
  },
  {
    key: "af557005d51e86a1ed8ff47da43911e9dbc6863f545320fe5dfb32535bfab0ca",
    title:
      "ประกาศสมัครงานไมโครซอฟท์ระบุกำลังลองทำพีซีราคาถูก หารายได้ผ่านโฆษณา-ค่าสมาชิก",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667785424
  },
  {
    key: "6fafc5c95d939cf98b1976cda4841b9bca14fc2b2d009a3cffdfdd52d4acbda3",
    title: "Life is a blank slate for Tom Dumoulin now, and ‘it feels good’",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667781791
  },
  {
    key: "ef7585e0311e6036ef45498d74a07e753161ffd10b8f8fed5aca33f5e4703eb1",
    title:
      "Apple ออกแถลงการณ์ ระบุมาตรการล็อกดาวน์ กระทบการผลิต iPhone 14 Pro และ iPhone 14 Pro Max",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667780208
  },
  {
    key: "d727311843ec2479b259d359eb18ff6e59fd20605339366fc3776ccba49bb9ee",
    title: "[ลือ] Meta จะปลดพนักงานครั้งใหญ่หลายพันคนในสัปดาห์นี้",
    site: {
      key: "add628675c459c297f69d1fa7fd6927a8704812913e1b2282545e686452d69fe",
      title: "Blognone"
    },
    timestamp: 1667778872
  },
  {
    key: "0ec0443c47976e8c281efacb5fedb6a23fc50f8a8567b28919a4d8257d1b6066",
    title:
      "Apple Issues iPhone 14 Pro Shipment Warning Ahead of Holiday Shopping Season",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667775463
  },
  {
    key: "989513150937b6181c8016aa236d0b273d9d48f251b502ea2faee7f62415dcc2",
    title: "Fun and games and a ‘bike race’ at the Saitama Criterium",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667751820
  },
  {
    key: "4d7d0e6db5013fa100046324cef38bd65c0c09d1748905f66213a451b0166b08",
    title: "Zwift takes it to the next level with the Zwift Hub",
    site: {
      key: "1eccc14e20fb45d0941026ceb8520f9680685bfb08ad8c07e4a6d113a0432f0e",
      title: "Cyclist.co.uk"
    },
    timestamp: 1667744042
  },
  {
    key: "e00bc829f16a7318eb372d90cff34a2965bc99f74ac9e1cb7a118ee188a1e67c",
    title:
      "Gurman: Apple Working On Revamped Siri Experience That Doesn't Require 'Hey Siri' Trigger Phrase",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667742894
  },
  {
    key: "5a6c115100ff635afe7feea49a4d46d128ecfbf8148e1aa35184651efad8613b",
    title: "The Origin of Metal Gear",
    site: {
      key: "cc9532440662d0a2ef9700277d3e58c076126125e885bf02439ddfc4b3437427",
      title: "markpeak.net"
    },
    timestamp: 1667742789
  },
  {
    key: "c508d93e1eb900592d0ce246157532367e82d0cc5b6f14afad7605387e73bbbe",
    title:
      "Geraint Thomas sets sights on the Giro: Tour de France? Completed it, mate",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667740642
  },
  {
    key: "4961aba374dc88386ef2adb183bbf0706e7b320aec8599b368f8470595cab153",
    title: "The mysteries of the astronaut biome",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667740240
  },
  {
    key: "f96511d0b30cfa25e2fa6072a2555e3b3f7f78086b6697aa3e726442c007c49a",
    title:
      "Sidelined But Smiling: Snowshoe With the Minority Mountain Bikers – Korey Hopkins",
    site: {
      key: "b88b01d657c7f925c05d345a3208db369e9b777c5321c992ae8cf9e0f6010c3a",
      title: "The Radavist"
    },
    timestamp: 1667739624
  },
  {
    key: "97a9fba5cbd00194cf4f1f2dc583750f509b71db1b8f278a2c91e26b48f79b22",
    title: "Algorithms quietly run the city of DC—and maybe your hometown",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667738346
  },
  {
    key: "be8e6e48479829a700b1c01dae7bad3aff760d0ad4b58b7d72420b3ca3474e2e",
    title:
      "Electric bikes could solve many of our problems, if attitudes change",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667736034
  },
  {
    key: "58a1efe1637964062b3f813f5cc66f7434a5fffed9a4abbbd5556e1385f33e92",
    title:
      "Time is running out for Cav and co. as Jérôme Pineau’s plans appear in jeopardy",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667732933
  },
  {
    key: "e5ece2161df310dbed01dbe33445af951a100697207c5f5cccba802f1f3b38af",
    title: "Gallery Page",
    site: {
      key: "1c040022952ad810c5cdc59d09d5694699217315e8ab1caff26a2f76efa40844",
      title: "@llun story"
    },
    timestamp: 1667732401
  },
  {
    key: "45f4bcdaee0a9432fb6693748f156f7441d428f87cbb5def2d4abc731d5c04ad",
    title:
      "Best electric hybrid bikes: ebikes for commuting, shopping and riding around town",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667725200
  },
  {
    key: "674e130e072d1fa84015efd35f337924283a7ba3580004ffca9f23fe5b0d81ed",
    title:
      "Pull text from images with over 40% off this top-rated optical character recognition app",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667721600
  },
  {
    key: "2f0ed2cee607fc4933dd98a233bc1c3b328bc5793797d8fb0e0a7811f8a638cb",
    title: "แนะนำ NCrunch สำหรับ Live Testing ใน .NET",
    site: {
      key: "c0f298a2fa12f68f246895c798fae036e6089662b23bbf9fcfe45d61b48ec183",
      title: "cc :: somkiat"
    },
    timestamp: 1667714290
  },
  {
    key: "e6320829c5e4d205f2b9c6e1915167c0b4a56f8af5d4f16832b211d362f692a3",
    title:
      "The 2023 BMW i7 proves a luxury car doesn’t need internal combustion",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667685685
  },
  {
    key: "9dfabf5a05554783c063c50189aeb94c964b9337750483e2e92c43dc7ad31540",
    title: "How The Wire helped me understand the 2023 BMW 760i xDrive",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667685683
  },
  {
    key: "3347c11877b4d9c23c350b20dd2495d66bdb517926c561ac17ff572bf5c9c405",
    title:
      "Twitter for iOS Updated With New $8 Subscription Offering Verification and More [Updated: Not Yet Live]",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667675278
  },
  {
    key: "72ba70da4a5d6871a79b9bb1d786c274e2771873fd2ae632907a80ccdf1b75fc",
    title: "Tony Fadell Joins Arm Board of Directors",
    site: {
      key: "8b0558b7511628eecfb3548688483a3ecf017b5cea6c3751b1e258b18a0d1837",
      title: "Daring Fireball"
    },
    timestamp: 1667672539
  },
  {
    key: "7c02d00575fa92ef90497a194f486f5b1ac1ee9ab12004bea580a02b06c1d724",
    title: "Gallery: the final day at Rouleur Live",
    site: {
      key: "81611e245f65d077f099142effb2f79b4493b7830317401bc63152f69a7ef45d",
      title: "Rouleur - Rouleur: Inside the peloton"
    },
    timestamp: 1667665092
  },
  {
    key: "814e7777d473d3d3568ca2086d58e74ef993478ad81d4a675664f1f8dead697e",
    title: "Four riders whose lives have been transformed by e-road bikes",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667660440
  },
  {
    key: "de94c787bd3b93dd722aede333c30c7c86cad9c8726dd86e481863a91db37daa",
    title:
      "The weekend’s best deals: A bunch of Apple devices, Sony headphones, 4K TVs, and more",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667656808
  },
  {
    key: "cf13af8013fd13e2e25d43a937599533bc9bb2d1dfa805852f48c898fc6d3312",
    title:
      "Apple in November: No new Macs or iOS updates, but a lot is still on the way",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667654339
  },
  {
    key: "2526634277132a04293f63d4773d63d3e909756b896c5f00104a3f662870845b",
    title: "10 years of FTL: The making of an enduring spaceship simulator",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667653247
  },
  {
    key: "fc381b5d307d4ff5ebd917ff93e59b376fe54b110e53502ccc3a148f2debfc49",
    title:
      "Top Stories: iOS 16.2 in Mid-December, No New Macs Until 2023, and More",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667653200
  },
  {
    key: "7597db17e167b084d6439a3e12edf634918e07dfa24f51d9a918b0d61c9518b2",
    title:
      "Desiknio’s ebikes use gearboxes and belt drives for hassle-free commuting",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667649600
  },
  {
    key: "3c6987d176bb6e81fd6623e7f77c3905e4039a22b01fd238d663bf50f4262cde",
    title: "Age of Empires is 25 years old and fans are shaping the franchise",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667644301
  },
  {
    key: "fa12db1cdb6fcd6122e321a1db8727163b66abcf2e7283d898c16dd8a5e62a35",
    title: "จดบันทึกแนวทางในการทดสอบฝั่ง Frontend ไว้หน่อย",
    site: {
      key: "c0f298a2fa12f68f246895c798fae036e6089662b23bbf9fcfe45d61b48ec183",
      title: "cc :: somkiat"
    },
    timestamp: 1667638544
  },
  {
    key: "b17aff79dc46706b6fc36d90e9a6578158f089e8a985a9173c3da5ce715223ff",
    title: "Code Direct is offering 20 hours of Python training for just $25",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667635200
  },
  {
    key: "0e0ca606e2b2a168e7a618336704847aa9aa0e4c5983d18de6afea2b75d6bd58",
    title: "All Quiet on the Western Front",
    site: {
      key: "cc9532440662d0a2ef9700277d3e58c076126125e885bf02439ddfc4b3437427",
      title: "markpeak.net"
    },
    timestamp: 1667618429
  },
  {
    key: "85fbee0417238ab76552feab7580f035047552c41a47ce6268a76359d27c7b06",
    title:
      "IceCube neutrino analysis pegs possible galactic source for cosmic rays",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667603926
  },
  {
    key: "c5b7958391d772f5014cd469f22233c60c8638cd7f7f79daa85ffdf273a23248",
    title:
      "Apple Settles Lawsuit With Employee Accused of Stealing Trade Secrets",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667602650
  },
  {
    key: "dcd3ace0ec4c79e7501cd8ae041b70300c2c6f658abbb5c4c3f31753859c83a1",
    title:
      "Herzog and Žižek become uncanny AI bots trapped in endless conversation",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667599373
  },
  {
    key: "d85709db7c673b02b55cdf81701fb1cf530070e9c91d90067bb07b3a49456a71",
    title: "HBO cancels Westworld before what was to be its final season",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667598061
  },
  {
    key: "3cf0215ebad7d362c282c609388d6aabd8460e9173379f08de133d790c7ed7dd",
    title: "Apple to Expand Live TV Advertising for Major League Soccer Deal",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667597532
  },
  {
    key: "fa764141f80686b1bf906fb4c64cc8392c0de99413dd5795e5b101cc3565f5e5",
    title:
      "Bivalent booster is 4x better against BA.5 in older adults, Pfizer says",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667597199
  },
  {
    key: "f0ee7b19b3c24e764f926c516961ee2704c0c3ac9180a8bc9a174ca85753f36f",
    title: "iOS 16: 15 Tips to Make Your iPhone Battery Last Longer",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667594793
  },
  {
    key: "2d2ec4d46b75e37fd133a0e10aa81dc8b49d23b8229a0c451b02f68c44a2b857",
    title: "Belkin Debuts Official MagSafe Car Charging Mount",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667591562
  },
  {
    key: "cc0741152aa5ccaabe8579260aae4cd7f9219e6db181eb8acd14f2e28c2f82d1",
    title:
      "Intel says that both Intel and AMD CPUs can update Arc GPU firmware [Updated]",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667591245
  },
  {
    key: "105bc723aa553faa1f6edf5396f50cc2fe324209d0014e5d8949b54e1422a98c",
    title: "Gallery: an unforgettable Friday night at Rouleur Live",
    site: {
      key: "81611e245f65d077f099142effb2f79b4493b7830317401bc63152f69a7ef45d",
      title: "Rouleur - Rouleur: Inside the peloton"
    },
    timestamp: 1667590502
  },
  {
    key: "c56236bb53667f051ed2b4b8a5be04d6a76384046e50823c5cfc56827c041708",
    title: "Musk floats several gimmicks to make Twitter profitable",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667589173
  },
  {
    key: "3b4977c732c75d26cc0ded98a9f9641d5898bdff046f5e9395fcadb477e346ed",
    title:
      "New 3T Strada ICR is claimed to be “the world’s most comfortable aero bike”",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667589151
  },
  {
    key: "12239b7a247da8a8a0aa77a98d578b382ae8cf45e14b071010e14c08b1190aca",
    title: "Container Query & overscroll-behavior",
    site: {
      key: "1c040022952ad810c5cdc59d09d5694699217315e8ab1caff26a2f76efa40844",
      title: "@llun story"
    },
    timestamp: 1667589079
  },
  {
    key: "7a41e0aab414649762ce87b43c69bf9a154844cad0d8f78dac982de0f43e6e0c",
    title: "Hands-On With the New Apple TV 4K",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667589028
  },
  {
    key: "9148cef1899e3a77d4cf2704ef9019aacac43c7294d81998670da51ce4938e29",
    title: "Cherry’s new mechanical switch hails from ’80s terminal keyboards",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667587859
  },
  {
    key: "19c8fa2d01649c110acd495f6135db6460ff2ba7938a4d130310b561bfbe49a8",
    title:
      "Swedish engineer creates playable accordion from 2 Commodore 64 computers",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667586378
  },
  {
    key: "d4e8acc6cf3bb7ec92ca991e0cc256c18256cfaf601c1abd3889f27ebb6f0189",
    title: "The best iPhone deals this month",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667586203
  },
  {
    key: "bd4db5a1230197c45100e103f0df9a2d40fca6ad9c3c2bead24e75df1802f6f9",
    title:
      "Swift Industries X Blue Lug debut their Caldera Cycling Bag & Clothing Collection!",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667584800
  },
  {
    key: "030b6694d967b207ac54eb1623303af111e605811c76c314d334d8ff1dcacf54",
    title: "Apple Arcade FAQ: ‘Battleheart Legacy+’ is now available",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667582916
  },
  {
    key: "164c04e7b0cfaec07b791abb6880b29562770dad14a97bf26a7702f196e6d8f7",
    title:
      "Apple TV+: ‘Causeway’ and ‘Selena Gomez: My Mind & Me’ are now streaming",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667581912
  },
  {
    key: "d3119969af489e2daaecb6d25473592b1f4110c6d1f3b7b397095211aeb9a527",
    title:
      "Netflix’s ad-supported plan doesn’t work on Apple TV, “older” Chromecasts, PS3",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667578972
  },
  {
    key: "ca1f5f05c549b0847193dbcc8025cc835ed3df089ba622ffa0b214b855fa05a1",
    title: "Best electric bikes | 16 top-rated ebikes for every type of rider",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667578800
  },
  {
    key: "201f0071a2dc9887f2db5c10c5c9ad4257dfd0ab3ac1858e2eb162f074345403",
    title: "Nukeproof adds Giga MX Link, plus Silver Horizon Components",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667577651
  },
  {
    key: "abd2576717d048fedaea9991aed96059edc60b0e61f1803844406c17f4941053",
    title: "Ibis Hakka MX Adventure Bike Rolls Out Fun New Colors",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667577644
  },
  {
    key: "6656e6518769ca24900b69a191350d7675e0b6f31179e148b06732c3b7c92d8a",
    title:
      "The rise of electric bikes: why bike brands, cycling campaigners and politicians are backing ebikes",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667577625
  },
  {
    key: "cfff3705234eec7e342f13c264163c96683805fdc23d91c479cacc393d1be402",
    title: "New Nukeproof Dolos 26″ Wheels send the Solum DJ Bike",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667577621
  },
  {
    key: "ae01f21ef98851d2aab8bcde74418382138266c0db606582bcf2375a808bd820",
    title: "Musk to gut Twitter infrastructure, cut costs by $1B annually",
    site: {
      key: "2acf20854e872e353d467511bfa1be39b1dd8fc63e9a751f5f69928cd3e13ca6",
      title: "Ars Technica"
    },
    timestamp: 1667577367
  },
  {
    key: "6202057739d7cfaac78e887d1cbff0075896a98e9cbb3b8f3e767277e908a4c3",
    title:
      "Apple's Extended Return Policy Now in Effect for 2022 Holiday Shopping Season",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667576421
  },
  {
    key: "49d1ceba17411963b9dc06522d8743b648830f1b3e36a6542867bcca2aa4d58d",
    title:
      "Deals: Apple's 11-Inch M2 iPad Pro Gets First Discount, Available for $749",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667575688
  },
  {
    key: "7b22b7ad5f42498964c1da4fbb6c5ce0e18c29fb65a66d122d3d8afc8875a6bb",
    title: "Apple Launches 2022 Holiday Gift Guide",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667575273
  },
  {
    key: "32279703e1e0ac18ded9b5b06594f9d04a538cc547a4ba76cd9bb13ee1b4d08e",
    title: "Apple is changing the TV app interface for the worse",
    site: {
      key: "13cb08a621f23244980e2e0c1a7a11bcc704c40dadb9b4ef6e62f8d2b88cc708",
      title: "Macworld"
    },
    timestamp: 1667574564
  },
  {
    key: "26adbbcf56c673da14d312bd01f2ae942e9aa067c8b2456882dc92156b593bbe",
    title:
      "Deals: Launch Day Discounts Hit New Apple TV 4K Models on Amazon, Available From $124.99",
    site: {
      key: "ad0b974d0b0471a9574519b296c8fc78f2b93212e55563e4396180ff7d159c83",
      title: "MacRumors: Mac News and Rumors - All Stories"
    },
    timestamp: 1667572612
  },
  {
    key: "705f2f8643c9502c40423fb29c2a1da1826ee0f4520779dc95f354fa3a3a5773",
    title: "Golang :: มาแล้วสำหรับ Proposal: Structured Logging",
    site: {
      key: "c0f298a2fa12f68f246895c798fae036e6089662b23bbf9fcfe45d61b48ec183",
      title: "cc :: somkiat"
    },
    timestamp: 1667572561
  },
  {
    key: "36aff9e6862f27a8f12988f59a2f44eda191ef6ad1edaa6c8a6edd3c0dd1bf3a",
    title: "Readers’ Rides: Mads’ Self-Made Plummet Hardtail 29er",
    site: {
      key: "b88b01d657c7f925c05d345a3208db369e9b777c5321c992ae8cf9e0f6010c3a",
      title: "The Radavist"
    },
    timestamp: 1667571686
  },
  {
    key: "7fd0efbe3e35ad694f8d1d72b5440de65cb04540426af1a43acd374d6bbc9607",
    title:
      "Win a $10k Bike from Pisgah Project 2022 In Raffle That Supports National Forest",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667570425
  },
  {
    key: "c219528cd39815d78971fe9ec5c74865f27705f465d73fba09273d8bec814f00",
    title: "Best budget electric bikes under £2,000 ridden and rated",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667570400
  },
  {
    key: "48c512d527dc626da153db3981aaf5df38137d4721596e6a053f4e6f8771bb17",
    title: "The former Jumbo CEO seems to be in big, big trouble",
    site: {
      key: "1c926b13b32d53089999f0b2dc51ee33a07600d7e15d1e216d772df624b8a458",
      title: "CyclingTips"
    },
    timestamp: 1667568024
  },
  {
    key: "4e9b81d7a3931450578c4cf9eed408275d0c47b56922d7e8975c7ebed25caa97",
    title:
      "Philly Bike Expo: TIME Bicycles ADHX Gravel Bike Brings Bio-Based Dyneema Fiber Stateside",
    site: {
      key: "acd05877eaeae5b4feacbddde5375edc5040a11bc39256163778cbe895073cb1",
      title: "Bikerumor"
    },
    timestamp: 1667566820
  },
  {
    key: "519164308b95d3d3b06c742c8c5d40aed6ba30dab57bed3f558b1b7caed28f23",
    title: "Electric bike maintenance: how to look after your ebike",
    site: {
      key: "900b385c9e837adc3371686406d3694509d4631fbc5f3c81de733bb4d0f25981",
      title: "BikeRadar"
    },
    timestamp: 1667566800
  }
] as Content[];

interface Props {
  title: string;
  site: string;
  timestamp: number;
}

const Item: FC<Props> = ({ title, site, timestamp }) => (
  <div class="rounded px-4">
    <h3>{title}</h3>
    <small>
      <a class="cursor-pointer mr-2">{site}</a>
      <span>
        {new Intl.DateTimeFormat("nl-NL", {
          dateStyle: "long",
          timeStyle: "short"
        }).format(timestamp * 1000)}
      </span>
    </small>
  </div>
);

const App: FC = () => {
  const [current, setCurrent] = useState<Content[]>(DATA.slice(0, PER_PAGE));
  const [isLoading, setLoading] = useState(false);
  return (
    <div
      className="prose m-auto w-full h-screen flex-shrink-0 p-6 overflow-auto overscroll-contain block"
      onScroll={(event) => {
        const target = event.currentTarget;
        requestAnimationFrame(() => {
          if (isLoading) return;
          if (current.length === DATA.length) return;

          const threshold = Math.floor(target.scrollHeight * 0.6);
          if (target.scrollTop < threshold) return;

          setLoading(true);
          setCurrent((items) => DATA.slice(0, items.length + PER_PAGE));
          setLoading(false);
        });
      }}
    >
      <p className="fixed bg-white inset-x-0 top-0 p-2">
        Total Items: {current.length}
      </p>
      {current.map((item) => (
        <Item
          title={item.title}
          site={item.site.title}
          timestamp={item.timestamp}
        />
      ))}
    </div>
  );
};

const root = ReactDOM.createRoot(document.getElementById("app"));
root.render(<App />);
View Compiled
Run Pen

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css
  2. https://unpkg.com/@tailwindcss/typography@0.2.x/dist/typography.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.