chore: auto organize imports in client codebase

The import statements in multiple files have been organized to improve code readability and maintainability. This was done using the `prettier-plugin-organize-imports` plugin.

.prettierrc

@@ -8,5 +8,6 @@
   "jsxSingleQuote": true,
   "bracketSpacing": true,
   "jsxBracketSameLine": false,
-  "arrowParens": "always"
+  "arrowParens": "always",
+  "plugins": ["prettier-plugin-organize-imports"]
 }

package-lock.json

@@ -34,6 +34,7 @@
         "eslint-config-next": "14.1.0",
         "postcss": "^8",
         "prettier": "^3.2.5",
+        "prettier-plugin-organize-imports": "^3.2.4",
         "tailwindcss": "^3.3.0",
         "typescript": "^5"
       },
@@ -4338,6 +4339,26 @@
         "url": "https://github.com/prettier/prettier?sponsor=1"
       }
     },
+    "node_modules/prettier-plugin-organize-imports": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/prettier-plugin-organize-imports/-/prettier-plugin-organize-imports-3.2.4.tgz",
+      "integrity": "sha512-6m8WBhIp0dfwu0SkgfOxJqh+HpdyfqSSLfKKRZSFbDuEQXDDndb8fTpRWkUrX/uBenkex3MgnVk0J3b3Y5byog==",
+      "dev": true,
+      "peerDependencies": {
+        "@volar/vue-language-plugin-pug": "^1.0.4",
+        "@volar/vue-typescript": "^1.0.4",
+        "prettier": ">=2.0",
+        "typescript": ">=2.9"
+      },
+      "peerDependenciesMeta": {
+        "@volar/vue-language-plugin-pug": {
+          "optional": true
+        },
+        "@volar/vue-typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/prop-types": {
       "version": "15.8.1",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",

package.json

@@ -39,6 +39,7 @@
     "eslint-config-next": "14.1.0",
     "postcss": "^8",
     "prettier": "^3.2.5",
+    "prettier-plugin-organize-imports": "^3.2.4",
     "tailwindcss": "^3.3.0",
     "typescript": "^5"
   }

src/app/affiliation/[shortName]/page.tsx

@@ -1,10 +1,10 @@
-import { affiliations } from '@/app/db/data'
-import { notFound } from 'next/navigation'
-import { Zilla_Slab } from 'next/font/google'
-import findDocumentsByAffiliation from './findDocumentsByAffiliation'
-import { Fragment } from 'react'
 import DocumentCard from '@/app/components/DocumentCard'
+import { affiliations } from '@/app/db/data'
+import { Zilla_Slab } from 'next/font/google'
 import Image from 'next/image'
+import { notFound } from 'next/navigation'
+import { Fragment } from 'react'
+import findDocumentsByAffiliation from './findDocumentsByAffiliation'
 
 const zillaSlab = Zilla_Slab({ subsets: ['latin'], weight: ['500'] })
 

src/app/affiliation/page.tsx

@@ -1,9 +1,9 @@
 import { affiliations } from '@/app/db/data'
-import { notFound } from 'next/navigation'
 import { Zilla_Slab } from 'next/font/google'
-import getAffiliations from './getAffiliations'
-import { Fragment } from 'react'
 import Image from 'next/image'
+import { notFound } from 'next/navigation'
+import { Fragment } from 'react'
+import getAffiliations from './getAffiliations'
 
 const zillaSlab = Zilla_Slab({ subsets: ['latin'], weight: ['500'] })
 
@@ -29,7 +29,7 @@ const AffiliationCard = ({
             alt='profile'
             width={1000}
             height={1000}
-            className='rounded-lg mx-auto p-8 object-cover w-full h-full'
+            className='rounded-lg mx-auto p-8 object-contain w-full h-full'
             src={image}
           />
         </div>

src/app/db/loaders.ts

@@ -1,4 +1,4 @@
-import { Document, Author, Affiliation, Topic, Nationality } from './data'
+import { Affiliation, Author, Document, Nationality, Topic } from './data'
 
 /**
  * Loads a document with the given ID using a web worker if available, and returns a promise that resolves with the document.

src/app/db/workers/authorLoader.worker.ts

@@ -1,4 +1,4 @@
-import { authors, Author } from '../data'
+import { Author, authors } from '../data'
 
 export function getAuthorsById(authorIds: string[]): { [key: string]: Author } {
   const result: { [key: string]: Author } = {}