From ffe7f986aee61a45625b3e04f190b8d28f96b1ac Mon Sep 17 00:00:00 2001
From: Wes Bos <wesbos@gmail.com>
Date: Fri, 14 Apr 2023 09:51:15 -0400
Subject: [PATCH] move to use unavatar

---
 src/components/Person.js | 27 +++++++++++++++++++--------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/components/Person.js b/src/components/Person.js
index fa8a5d82..b1e8597a 100644
--- a/src/components/Person.js
+++ b/src/components/Person.js
@@ -1,18 +1,26 @@
 import React, { useState, useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { name } from 'country-emoji';
-import * as icons from '../util/icons';
 import { useParams } from '@remix-run/react';
+import * as icons from '../util/icons';
 
 export default function Person({ person }) {
   const url = new URL(person.url);
-  const twitter = person.twitter ? `https://unavatar.io/${person.twitter.replace('@', '')}` : null;
+  const twitter = person.twitter
+    ? `https://unavatar.io/${person.twitter.replace('@', '')}`
+    : null;
   const website = `https://unavatar.io/${url.host}`;
-  const unavatar = person.twitter ? `${twitter}?fallback=${website}` : website;
-  const img = `https://images.weserv.nl/?url=${unavatar}&w=100&l=9&af&il&n=-1`;
+  const unavatar = person.twitter
+    ? `${twitter}?fallback=${website}&ttl=28d`
+    : website;
+  // const img = `https://images.weserv.nl/?url=${unavatar}&w=100&l=9&af&il&n=-1`;
+  const img = unavatar;
   const { tag: currentTag } = useParams();
   return (
-    <div className="PersonWrapper" style={{ contentVisibility: "auto", containIntrinsicHeight: '560px' }}>
+    <div
+      className="PersonWrapper"
+      style={{ contentVisibility: 'auto', containIntrinsicHeight: '560px' }}
+    >
       <div className="PersonInner">
         <header>
           <img
@@ -22,7 +30,7 @@ export default function Person({ person }) {
             alt={person.name}
             onError={({ currentTarget }) => {
               currentTarget.onerror = null; // prevents looping
-              currentTarget.src = "/default.png";
+              currentTarget.src = '/default.png';
             }}
             loading="lazy"
           />
@@ -44,8 +52,11 @@ export default function Person({ person }) {
         </header>
         <p>{person.description}</p>
         <ul className="Tags">
-          {person.tags.map(tag => (
-            <li className={`Tag small ${tag === currentTag ? 'currentTag' : ''}`} key={tag}>
+          {person.tags.map((tag) => (
+            <li
+              className={`Tag small ${tag === currentTag ? 'currentTag' : ''}`}
+              key={tag}
+            >
               {tag}
             </li>
           ))}