feat: add tests for imageProxy

apps/web/src/components/Notification/WalletProfile.tsx

@@ -1,10 +1,10 @@
 import { Image } from '@components/UI/Image';
-import imageProxy from '@lib/imageProxy';
 import { POLYGONSCAN_URL } from 'data/constants';
 import type { Wallet } from 'lens';
 import type { FC } from 'react';
 import formatAddress from 'utils/formatAddress';
 import getStampFyiURL from 'utils/getStampFyiURL';
+import imageProxy from 'utils/imageProxy';
 
 interface NotificationWalletProfileProps {
   wallet: Wallet;

apps/web/src/components/Profile/Cover.tsx

@@ -1,7 +1,7 @@
-import imageProxy from '@lib/imageProxy';
 import { COVER, STATIC_IMAGES_URL } from 'data/constants';
 import type { FC } from 'react';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 
 interface CoverProps {
   cover: string;

apps/web/src/components/Settings/Profile/Picture.tsx

@@ -6,7 +6,6 @@ import { Modal } from '@components/UI/Modal';
 import { Spinner } from '@components/UI/Spinner';
 import { PencilIcon } from '@heroicons/react/outline';
 import getSignature from '@lib/getSignature';
-import imageProxy from '@lib/imageProxy';
 import { Mixpanel } from '@lib/mixpanel';
 import onError from '@lib/onError';
 import splitSignature from '@lib/splitSignature';
@@ -28,6 +27,7 @@ import toast from 'react-hot-toast';
 import { useAppStore } from 'src/store/app';
 import { SETTINGS } from 'src/tracking';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 import { useContractWrite, useSignTypedData } from 'wagmi';
 
 import ImageCropperController from './ImageCropperController';

apps/web/src/components/Settings/Profile/Profile.tsx

@@ -12,7 +12,6 @@ import { PencilIcon } from '@heroicons/react/outline';
 import getProfileAttribute from '@lib/getProfileAttribute';
 import getSignature from '@lib/getSignature';
 import hasPrideLogo from '@lib/hasPrideLogo';
-import imageProxy from '@lib/imageProxy';
 import { Mixpanel } from '@lib/mixpanel';
 import onError from '@lib/onError';
 import splitSignature from '@lib/splitSignature';
@@ -33,6 +32,7 @@ import toast from 'react-hot-toast';
 import { useAppStore } from 'src/store/app';
 import { SETTINGS } from 'src/tracking';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 import { v4 as uuid } from 'uuid';
 import { useContractWrite, useSignTypedData } from 'wagmi';
 import { object, string, union } from 'zod';

apps/web/src/components/Shared/Attachments.tsx

@@ -3,7 +3,6 @@ import { Image } from '@components/UI/Image';
 import { LightBox } from '@components/UI/LightBox';
 import type { NewLensterAttachment } from '@generated/types';
 import { ExternalLinkIcon, XIcon } from '@heroicons/react/outline';
-import imageProxy from '@lib/imageProxy';
 import { Mixpanel } from '@lib/mixpanel';
 import { stopEventPropagation } from '@lib/stopEventPropagation';
 import { Trans } from '@lingui/macro';
@@ -15,6 +14,7 @@ import { useState } from 'react';
 import { usePublicationStore } from 'src/store/publication';
 import { PUBLICATION } from 'src/tracking';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 
 import Audio from './Audio';
 import Video from './Video';

apps/web/src/components/Shared/Audio/CoverImage.tsx

@@ -1,14 +1,14 @@
 import { Image } from '@components/UI/Image';
 import { Spinner } from '@components/UI/Spinner';
 import { PhotographIcon } from '@heroicons/react/outline';
-import imageProxy from '@lib/imageProxy';
 import uploadToIPFS from '@lib/uploadToIPFS';
 import clsx from 'clsx';
 import { ATTACHMENT, ERROR_MESSAGE } from 'data/constants';
 import type { ChangeEvent, FC, Ref } from 'react';
 import { useState } from 'react';
 import toast from 'react-hot-toast';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 
 interface CoverImageProps {
   isNew: boolean;

apps/web/src/components/Shared/IFramely/Embed.tsx

@@ -1,13 +1,13 @@
 import { Card } from '@components/UI/Card';
 import { Image } from '@components/UI/Image';
 import type { OG } from '@generated/types';
-import imageProxy from '@lib/imageProxy';
 import { Mixpanel } from '@lib/mixpanel';
 import { stopEventPropagation } from '@lib/stopEventPropagation';
 import { ATTACHMENT } from 'data/constants';
 import Link from 'next/link';
 import type { FC } from 'react';
 import { PUBLICATION } from 'src/tracking';
+import imageProxy from 'utils/imageProxy';
 
 interface EmbedProps {
   og: OG;

apps/web/src/components/Shared/Lexical/Plugins/AtMentionsPlugin.tsx

@@ -6,7 +6,6 @@ import {
   TypeaheadOption,
   useBasicTypeaheadTriggerMatch
 } from '@lexical/react/LexicalTypeaheadMenuPlugin';
-import imageProxy from '@lib/imageProxy';
 import isVerified from '@lib/isVerified';
 import clsx from 'clsx';
 import { AVATAR } from 'data/constants';
@@ -19,6 +18,7 @@ import * as ReactDOM from 'react-dom';
 import formatHandle from 'utils/formatHandle';
 import getIPFSLink from 'utils/getIPFSLink';
 import getStampFyiURL from 'utils/getStampFyiURL';
+import imageProxy from 'utils/imageProxy';
 
 import { $createMentionNode } from '../Nodes/MentionsNode';
 

apps/web/src/components/Shared/Video.tsx

@@ -1,10 +1,10 @@
 import 'plyr-react/plyr.css';
 
-import imageProxy from '@lib/imageProxy';
 import Plyr from 'plyr-react';
 import type { FC } from 'react';
 import { memo } from 'react';
 import getIPFSLink from 'utils/getIPFSLink';
+import imageProxy from 'utils/imageProxy';
 
 interface VideoProps {
   src: string;

apps/web/src/components/Shared/WalletProfile.tsx

@@ -1,11 +1,11 @@
 import { Image } from '@components/UI/Image';
 import { ExternalLinkIcon } from '@heroicons/react/outline';
-import imageProxy from '@lib/imageProxy';
 import { POLYGONSCAN_URL } from 'data/constants';
 import type { Wallet } from 'lens';
 import type { FC } from 'react';
 import formatAddress from 'utils/formatAddress';
 import getStampFyiURL from 'utils/getStampFyiURL';
+import imageProxy from 'utils/imageProxy';
 
 import Slug from './Slug';
 

apps/web/src/lib/getAvatar.ts

@@ -1,8 +1,7 @@
 import { AVATAR, ZERO_ADDRESS } from 'data/constants';
 import getIPFSLink from 'utils/getIPFSLink';
 import getStampFyiURL from 'utils/getStampFyiURL';
-
-import imageProxy from './imageProxy';
+import imageProxy from 'utils/imageProxy';
 
 const skipList = [
   'static-assets.lenster.xyz',

apps/web/tsconfig.json

@@ -11,5 +11,11 @@
       "@generated*": ["src/generated*"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "src/styles/index.css"]
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "src/styles/index.css",
+    "../../packages/utils/imageProxy.ts"
+  ]
 }

tests/scripts/utils/imageProxy.spec.ts

@@ -0,0 +1,17 @@
+import { expect, test } from '@playwright/test';
+import { AVATAR, USER_CONTENT_URL } from 'data/constants';
+import imageProxy from 'utils/imageProxy';
+
+test.describe('imageProxy', async () => {
+  test('should return a url with just the image url when no name is provided', async () => {
+    const url = 'image.jpg';
+    const result = imageProxy(url);
+    await expect(result).toEqual(`${USER_CONTENT_URL}/${url}`);
+  });
+
+  test('should return a url with the image url and name when name is provided', async () => {
+    const url = 'image.jpg';
+    const result = imageProxy(url, AVATAR);
+    await expect(result).toEqual(`${USER_CONTENT_URL}/${AVATAR}/${url}`);
+  });
+});