Merge pull request #46 from openequella/feature/default_title_filename

feat: use filename for the default Title

src/KalturaUploader.tsx

@@ -77,16 +77,18 @@ const KalturaUploaderInternal = ({
             allowedTypes={mediaType.allowedTypes}
             idPrefix={kalturaUploaderId}
             kClient={client}
-            onUploadSuccessful={(uploadResult: KalturaUploadToken) =>
-              dispatch({ id: "upload_successful", uploadResult })
-            }
+            onUploadSuccessful={(
+              filename: string,
+              uploadResult: KalturaUploadToken
+            ) => dispatch({ id: "upload_successful", filename, uploadResult })}
           />
         </>
       )}
       {state.id === "media_uploaded" && (
         <Metadata
           idPrefix={kalturaUploaderId}
           kClient={client}
+          defaultTitle={state.filename}
           mediaType={mediaType.type}
           onEntryCreated={(entry: KalturaMediaEntry) =>
             dispatch({ id: "entry_created", entry })

src/KalturaUploaderReducer.ts

@@ -5,17 +5,25 @@ import {
 
 export type State =
   | { id: "start" }
-  | { id: "media_uploaded"; uploadResult: KalturaUploadToken }
+  | { id: "media_uploaded"; filename: string; uploadResult: KalturaUploadToken }
   | { id: "complete"; entry: KalturaMediaEntry };
 
 export type Action =
-  | { id: "upload_successful"; uploadResult: KalturaUploadToken }
+  | {
+      id: "upload_successful";
+      filename: string;
+      uploadResult: KalturaUploadToken;
+    }
   | { id: "entry_created"; entry: KalturaMediaEntry };
 
 export const reducer = (_: State, action: Action): State => {
   switch (action.id) {
     case "upload_successful":
-      return { id: "media_uploaded", uploadResult: action.uploadResult };
+      return {
+        id: "media_uploaded",
+        filename: action.filename,
+        uploadResult: action.uploadResult,
+      };
     case "entry_created":
       return { id: "complete", entry: action.entry };
     default:

src/Metadata.tsx

@@ -53,6 +53,10 @@ export interface MetadataProps {
    * `createClient` from `KalturaModule`.
    */
   kClient: KalturaClient;
+  /**
+   * An initial default value for the Media Entry's Title.
+   */
+  defaultTitle: string;
   /**
    * The media type for the Media Entry which is to be created - typically matching the type of file
    * uploaded which resulted in the value provided for `uploadResult`.
@@ -78,12 +82,13 @@ export interface MetadataProps {
 export const Metadata = ({
   idPrefix,
   kClient,
+  defaultTitle,
   mediaType,
   onEntryCreated,
   uploadResult,
 }: MetadataProps): JSX.Element => {
   const [form, setFormField, formField] = useForm({
-    name: "",
+    name: defaultTitle,
     description: "",
     mediaType,
   });

src/Upload.tsx

@@ -48,9 +48,13 @@ export interface UploadProps {
   /**
    * Callback to be triggered upon a successful file upload.
    *
+   * @param filename the name of the file which was successfully uploaded
    * @param uploadResult details returned from the server about the upload attempt.
    */
-  onUploadSuccessful: (uploadResult: KalturaUploadToken) => void;
+  onUploadSuccessful: (
+    filename: string,
+    uploadResult: KalturaUploadToken
+  ) => void;
 }
 
 /**
@@ -77,7 +81,7 @@ export const Upload = ({
         if (uploadToken) {
           const uploadResult = await uploadFile(kClient, uploadToken, file);
           uploadResult
-            ? dispatch({ id: "upload_success", uploadResult })
+            ? dispatch({ id: "upload_success", file, uploadResult })
             : dispatchError("Attempt to upload to Kaltura failed.");
         } else {
           dispatchError(
@@ -101,7 +105,7 @@ export const Upload = ({
         void doUpload(state.file);
         break;
       case "upload_complete":
-        onUploadSuccessful(state.uploadResult);
+        onUploadSuccessful(state.file.name, state.uploadResult);
         break;
     }
   }, [state, dispatch, kClient, onUploadSuccessful]);

src/UploadReducer.ts

@@ -4,14 +4,14 @@ export type State =
   | { id: "start" }
   | { id: "file_selected"; file: File }
   | { id: "file_uploading"; file: File }
-  | { id: "upload_complete"; uploadResult: KalturaUploadToken }
+  | { id: "upload_complete"; file: File; uploadResult: KalturaUploadToken }
   | { id: "error"; error: Error };
 
 export type Action =
   | { id: "reset" }
   | { id: "select_file"; file: File }
   | { id: "upload_file"; file: File }
-  | { id: "upload_success"; uploadResult: KalturaUploadToken }
+  | { id: "upload_success"; file: File; uploadResult: KalturaUploadToken }
   | { id: "failed"; cause: Error };
 
 export const reducer = (_: State, action: Action): State => {
@@ -23,7 +23,11 @@ export const reducer = (_: State, action: Action): State => {
     case "upload_file":
       return { id: "file_uploading", file: action.file };
     case "upload_success":
-      return { id: "upload_complete", uploadResult: action.uploadResult };
+      return {
+        id: "upload_complete",
+        file: action.file,
+        uploadResult: action.uploadResult,
+      };
     case "failed":
       return { id: "error", error: action.cause };
     default: