- implement lists

- implement generic sections
- implement list actions
- implement error handlers

src/components/shared/Avatar.js

@@ -1,15 +1,18 @@
 import cx from "classnames";
-import React, { useContext } from "react";
+import { toUrl } from "gatsby-source-gravatar";
+import React, { useContext, useMemo } from "react";
 import UserContext from "../../contexts/UserContext";
 import styles from "./Avatar.module.css";
 
 const Avatar = ({ className }) => {
   const { user } = useContext(UserContext);
 
+  const photoURL = useMemo(() => toUrl(user.email, "size=128"), [user.email]);
+
   return (
     <img
       className={cx(styles.container, className)}
-      src={user.photoURL}
+      src={photoURL}
       alt={user.displayName}
     />
   );