chore(git): merge pull request #185 from fixes-1-7 into staging

Reviewed-on: #185

src/components/Inputs/ImageUpload.module.scss

@@ -0,0 +1,11 @@
+.spinner {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1;
+  -webkit-backdrop-filter: blur(1px);
+  backdrop-filter: blur(1px);
+  pointer-events: none;
+}

src/components/Inputs/ImageUpload.tsx

@@ -8,6 +8,8 @@ import {
 } from '../../controllers'
 import { errorFeedback } from '../../types'
 import { MediaInputPopover } from './MediaInputPopover'
+import { Spinner } from 'components/Spinner'
+import styles from './ImageUpload.module.scss'
 
 export interface ImageUploadProps {
   multiple?: boolean | undefined
@@ -15,6 +17,7 @@ export interface ImageUploadProps {
 }
 export const ImageUpload = React.memo(
   ({ multiple = false, onChange }: ImageUploadProps) => {
+    const [isLoading, setIsLoading] = useState(false)
     const [mediaOption, setMediaOption] = useState<MediaOption>(
       MEDIA_OPTIONS[0]
     )
@@ -28,6 +31,7 @@ export const ImageUpload = React.memo(
       async (acceptedFiles: File[]) => {
         if (acceptedFiles.length) {
           try {
+            setIsLoading(true)
             const imageController = new ImageController(mediaOption)
             const urls: string[] = []
             for (let i = 0; i < acceptedFiles.length; i++) {
@@ -37,6 +41,8 @@ export const ImageUpload = React.memo(
             onChange(urls)
           } catch (error) {
             errorFeedback(error)
+          } finally {
+            setIsLoading(false)
           }
         }
       },
@@ -79,7 +85,6 @@ export const ImageUpload = React.memo(
         />
         <div className='uploadBoxMainInside' {...getRootProps()} tabIndex={-1}>
           <input id='featuredImageUrl-upload' {...getInputProps()} />
-
           <span>{dropzoneLabel}</span>
           <div
             className='FiltersMainElement'
@@ -109,6 +114,11 @@ export const ImageUpload = React.memo(
               </div>
             </div>
           </div>
+          {isLoading && (
+            <div className={styles.spinner}>
+              <Spinner />
+            </div>
+          )}
         </div>
       </div>
     )

src/pages/mod/loader.ts

@@ -26,7 +26,7 @@ import {
 
 export const modRouteLoader =
   (ndkContext: NDKContextType) =>
-  async ({ params }: LoaderFunctionArgs) => {
+  async ({ params, request }: LoaderFunctionArgs) => {
     const { naddr } = params
     if (!naddr) {
       log(true, LogType.Error, 'Required naddr.')
@@ -51,6 +51,14 @@ export const modRouteLoader =
     const loggedInUserPubkey =
       (userState?.user?.pubkey as string | undefined) || getFallbackPubkey()
 
+    // Check if editing and the user is the original author
+    // Redirect if NOT
+    const url = new URL(request.url)
+    const isEditMode = url.pathname.includes('edit-mod')
+    if (isEditMode && loggedInUserPubkey !== pubkey) {
+      return redirect(appRoutes.mods)
+    }
+
     try {
       // Set up the filters
       // Main mod content