feat: sync pictureFile with oidc if it isn't set already (#17397)

* feat: sync pictureFile with oidc if it isn't set already

fix: move picture writer to get userId

fix: move await promise to the top of the setPicure function before checking its value and automatically create the user folder

chore: code cleanup

* fix: extension double dot

---------

Co-authored-by: Jason Rasmussen <jason@rasm.me>

server/src/utils/mime-types.spec.ts

@@ -101,6 +101,20 @@ describe('mimeTypes', () => {
     });
   }
 
+  describe('toExtension', () => {
+    it('should get an extension for a png file', () => {
+      expect(mimeTypes.toExtension('image/png')).toEqual('.png');
+    });
+
+    it('should get an extension for a jpeg file', () => {
+      expect(mimeTypes.toExtension('image/jpeg')).toEqual('.jpg');
+    });
+
+    it('should get an extension from a webp file', () => {
+      expect(mimeTypes.toExtension('image/webp')).toEqual('.webp');
+    });
+  });
+
   describe('profile', () => {
     it('should contain only lowercase mime types', () => {
       const keys = Object.keys(mimeTypes.profile);

server/src/utils/mime-types.ts

@@ -55,6 +55,10 @@ const image: Record<string, string[]> = {
   '.webp': ['image/webp'],
 };
 
+const extensionOverrides: Record<string, string> = {
+  'image/jpeg': '.jpg',
+};
+
 /**
  * list of supported image extensions from https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types excluding svg
  * @TODO share with the client
@@ -104,6 +108,11 @@ const types = { ...image, ...video, ...sidecar };
 const isType = (filename: string, r: Record<string, string[]>) => extname(filename).toLowerCase() in r;
 
 const lookup = (filename: string) => types[extname(filename).toLowerCase()]?.[0] ?? 'application/octet-stream';
+const toExtension = (mimeType: string) => {
+  return (
+    extensionOverrides[mimeType] || Object.entries(types).find(([, mimeTypes]) => mimeTypes.includes(mimeType))?.[0]
+  );
+};
 
 export const mimeTypes = {
   image,
@@ -120,6 +129,8 @@ export const mimeTypes = {
   isVideo: (filename: string) => isType(filename, video),
   isRaw: (filename: string) => isType(filename, raw),
   lookup,
+  /** return an extension (including a leading `.`) for a mime-type */
+  toExtension,
   assetType: (filename: string) => {
     const contentType = lookup(filename);
     if (contentType.startsWith('image/')) {