feat(Admin > Edit Album): Clipboard for reference

Author: danactive

src/components/AdminAlbum/Fields.tsx

@@ -9,6 +9,7 @@ import { useEffect, useRef, useState } from 'react'
 import useSWR from 'swr'
 import xml2js from 'xml2js'
 
+import { transformReference } from '../../models/album'
 import type { Gallery, IndexedKeywords, ItemReferenceSource, RawXmlAlbum, RawXmlItem } from '../../types/common'
 import ComboBox from '../ComboBox'
 import { type XmlItemState } from './AdminAlbumClient'
@@ -352,6 +353,21 @@ export default function Fields(
               title="Reference name/ID (ref.name)"
               sx={{ flex: 1, minWidth: 0 }}
             />
+            <IconButton
+              size="sm"
+              variant="outlined"
+              onClick={() => {
+                const reference = transformReference(editedItem?.ref)
+                if (reference) {
+                  navigator.clipboard.writeText(reference[0])
+                }
+              }}
+              disabled={!editedItem?.ref?.source || !editedItem?.ref?.name}
+              title="Copy reference URL to clipboard"
+              sx={{ minWidth: 'auto', px: 1 }}
+            >
+              📋
+            </IconButton>
           </Stack>
           <Button onClick={generateXml} variant="solid" color="primary">
             Generate XML

src/models/__tests__/album.test.ts

@@ -193,7 +193,7 @@ describe('Album library', () => {
           source: 'youtube',
         },
       }
-      const actual = transformReference(mock)
+      const actual = transformReference(mock.ref)
       if (actual === null) {
         expect(actual).not.toBeNull()
       } else {
@@ -209,7 +209,7 @@ describe('Album library', () => {
           source: 'wikipedia',
         },
       }
-      const actual = transformReference(mock)
+      const actual = transformReference(mock.ref)
       if (actual === null) {
         expect(actual).not.toBeNull()
       } else {

src/models/album.ts

@@ -108,7 +108,10 @@ export const transformPersons = (photoSearchValues: XmlItem['search'], definedPe
   return null
 }
 
-export const transformReference = (item: XmlItem): [string, string] | null => {
+export const transformReference = (ref: XmlItem['ref']): [string, string] | null => {
+  if (!ref) {
+    return null
+  }
   const baseUrl = (source: ItemReferenceSource) => {
     switch (source) {
       case 'facebook':
@@ -125,13 +128,10 @@ export const transformReference = (item: XmlItem): [string, string] | null => {
         return null // Return null instead of throwing for unknown sources
     }
   }
-  if (!('ref' in item) || !item.ref) {
-    return null
-  }
-  if ('name' in item.ref && 'source' in item.ref) {
-    const url = baseUrl(item.ref.source)
+  if ('name' in ref && 'source' in ref) {
+    const url = baseUrl(ref.source)
     if (!url) return null // Return null if source is invalid
-    return [url + item.ref.name, item.ref.name]
+    return [url + ref.name, ref.name]
   }
   return null
 }
@@ -225,7 +225,7 @@ const transformJsonSchema = (dirty: XmlAlbum, persons: Person[]): Album => {
       photoPath,
       mediaPath: (item.type === 'video' && videoPaths) ? videoPaths[0] : photoPath,
       videoPaths,
-      reference: transformReference(item),
+      reference: transformReference(item?.ref),
     }
 
     return removeUndefinedFields(out)