code dump frontend

frontend/components/PhotoCircle.tsx

@@ -0,0 +1,29 @@
+export const PhotoCircle = function PhotoCircle({
+  src,
+  alt,
+  size = "w-48 h-48",
+  width = "256",
+  height = "256",
+}: PhotoCircleOpts) {
+  return (
+    <div
+      className={`${size} rounded-full border-4 border-white shadow-md overflow-hidden`}
+    >
+      <img
+        src={src}
+        alt={alt ?? "A photo in circle"}
+        width={width}
+        height={height}
+        className="w-full h-full object-cover"
+      />
+    </div>
+  );
+};
+
+type PhotoCircleOpts = {
+  src: string;
+  alt?: string;
+  size?: string;
+  width?: string;
+  height?: string;
+};