-
Notifications
You must be signed in to change notification settings - Fork 14
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(v2): start conversion & manage conversion progress (#108)
* feat(v2): start conversion & manage conversion progress * file card icon * electron window api rename * disable start conversion button when no file * add tests * fix lint * fix lint * renaming electron-api.ts to dialog.ts * temp lint fix
- Loading branch information
Showing
33 changed files
with
393 additions
and
42 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,4 @@ | ||
dist-electron | ||
|
||
# TODO temp fix for eslint/ts error in electron/file.types.ts | ||
electron/file.types.ts |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import { ipcMain } from 'electron'; | ||
import type { VideoFile } from './file.types'; | ||
import type { BrowserWindow } from 'electron'; | ||
|
||
export class ConversionManager { | ||
mainWindow: BrowserWindow; | ||
isConversionInterrupted: boolean; | ||
|
||
constructor(mainWindow: BrowserWindow) { | ||
this.mainWindow = mainWindow; | ||
this.isConversionInterrupted = false; | ||
|
||
ipcMain.handle('start-conversion', (_event, { files }: { files: VideoFile[] }) => { | ||
this.isConversionInterrupted = false; | ||
this.handleFileConversionStart(files[0].path); | ||
}); | ||
|
||
ipcMain.handle('stop-conversion', () => { | ||
this.isConversionInterrupted = true; | ||
}); | ||
} | ||
|
||
handleFileConversionStart(filePath: string) { | ||
this.mainWindow.webContents.send('file-conversion-start', { filePath }); | ||
} | ||
|
||
handleFileConversionProgress() { | ||
this.mainWindow.webContents.send('file-conversion-progress'); | ||
} | ||
|
||
handleFileConversionEnd() { | ||
this.mainWindow.webContents.send('file-conversion-end'); | ||
} | ||
|
||
handleFileConversionError() { | ||
this.mainWindow.webContents.send('file-conversion-error'); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import type { IpcRendererEvent } from 'electron'; | ||
|
||
export type FileConversionStartCallback = (event: IpcRendererEvent, { filePath }: { filePath: string }) => void; | ||
|
||
export type FileConversionProgressCallback = ( | ||
event: IpcRendererEvent, | ||
{ filePath, progress }: { filePath: string; progress: number }, | ||
) => void; | ||
|
||
export type FileConversionEndCallback = (event: IpcRendererEvent, { filePath }: { filePath: string }) => void; | ||
|
||
export type FileConversionErrorCallback = ( | ||
event: IpcRendererEvent, | ||
{ filePath, error }: { error: string; filePath: string }, | ||
) => void; |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,17 +1,33 @@ | ||
/// <reference types="vite-plugin-electron/electron-env" /> | ||
import type { | ||
FileConversionEndCallback, | ||
FileConversionErrorCallback, | ||
FileConversionProgressCallback, | ||
FileConversionStartCallback, | ||
} from './conversion-events.types'; | ||
import type { VideoFile } from './file.types'; | ||
|
||
declare namespace NodeJS { | ||
interface ProcessEnv { | ||
DIST: string; | ||
VITE_PUBLIC: string; | ||
} | ||
} | ||
|
||
export interface IElectronAPI { | ||
export interface IDialog { | ||
openDirectory: () => Promise<string>; | ||
} | ||
|
||
export interface IConversion { | ||
onFileConversionEnd: (callback: FileConversionEndCallback) => void; | ||
onFileConversionError: (callback: FileConversionErrorCallback) => void; | ||
onFileConversionProgress: (callback: FileConversionProgressCallback) => void; | ||
onFileConversionStart: (callback: FileConversionStartCallback) => void; | ||
startConversion: ({ files }: { files: VideoFile[] }) => void; | ||
} | ||
|
||
declare global { | ||
interface Window { | ||
electronAPI: IElectronAPI; | ||
conversion: IConversion; | ||
dialog: IDialog; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
export type VideoFile = { | ||
name: string; | ||
path: string; | ||
progress: number; | ||
size: number; | ||
status: 'imported' | 'converting' | 'conversionSuccess' | 'conversionError'; | ||
type: string; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,21 @@ | ||
import { contextBridge, ipcRenderer } from 'electron'; | ||
import type { | ||
FileConversionEndCallback, | ||
FileConversionErrorCallback, | ||
FileConversionProgressCallback, | ||
FileConversionStartCallback, | ||
} from './conversion-events.types'; | ||
import type { VideoFile } from './file.types'; | ||
|
||
contextBridge.exposeInMainWorld('electronAPI', { | ||
contextBridge.exposeInMainWorld('dialog', { | ||
openDirectory: () => ipcRenderer.invoke('dialog:openDirectory'), | ||
}); | ||
|
||
contextBridge.exposeInMainWorld('conversion', { | ||
onFileConversionEnd: (callback: FileConversionEndCallback) => ipcRenderer.on('file-conversion-end', callback), | ||
onFileConversionError: (callback: FileConversionErrorCallback) => ipcRenderer.on('file-conversion-error', callback), | ||
onFileConversionProgress: (callback: FileConversionProgressCallback) => | ||
ipcRenderer.on('file-conversion-progress', callback), | ||
onFileConversionStart: (callback: FileConversionStartCallback) => ipcRenderer.on('file-conversion-start', callback), | ||
startConversion: ({ files }: { files: VideoFile[] }) => ipcRenderer.invoke('start-conversion', { files }), | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import { AlertOctagonIcon, CheckCircleIcon, FileVideoIcon, Loader2Icon } from 'lucide-react'; | ||
import { fileStatusSchema } from 'src/types/file.types'; | ||
import type { FileStatus } from 'src/types/file.types'; | ||
|
||
type FileCardIconProps = { | ||
status: FileStatus; | ||
}; | ||
|
||
export const FileCardIcon = ({ status }: FileCardIconProps) => { | ||
switch (status) { | ||
case fileStatusSchema.enum.imported: | ||
return <FileVideoIcon className="shrink-0" data-testid="FileCardIcon_fileIcon" size="24" />; | ||
case fileStatusSchema.enum.converting: | ||
return <Loader2Icon className="shrink-0 animate-spin" data-testid="FileCardIcon_loaderIcon" size="24" />; | ||
case fileStatusSchema.enum.conversionSuccess: | ||
return <CheckCircleIcon className="shrink-0 text-success" data-testid="FileCardIcon_checkIcon" size="24" />; | ||
case fileStatusSchema.enum.conversionError: | ||
return <AlertOctagonIcon className="shrink-0 text-destructive" data-testid="FileCardIcon_alertIcon" size="24" />; | ||
} | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
import { render, screen } from '@testing-library/react'; | ||
import { fileStatusSchema } from 'src/types/file.types'; | ||
import { describe, expect, it } from 'vitest'; | ||
import { FileCard } from '../FileCard'; | ||
import type { VideoFile } from 'src/types/file.types'; | ||
|
||
describe('FileCard', () => { | ||
it('should not display a progress bar if file is not converting', () => { | ||
const file = { | ||
name: 'matrix.mkv', | ||
path: '/path/matrix.mkv', | ||
progress: 0, | ||
size: 1024, | ||
status: fileStatusSchema.enum.imported, | ||
} as VideoFile; | ||
render(<FileCard file={file} />); | ||
|
||
expect(screen.queryByRole('progressbar')).not.toBeInTheDocument(); | ||
}); | ||
|
||
it('should display a progress bar if file is converting', () => { | ||
const file = { | ||
name: 'matrix.mkv', | ||
path: '/path/matrix.mkv', | ||
progress: 0, | ||
size: 1024, | ||
status: fileStatusSchema.enum.converting, | ||
} as VideoFile; | ||
render(<FileCard file={file} />); | ||
|
||
expect(screen.getByRole('progressbar')).toBeVisible(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
import { render, screen } from '@testing-library/react'; | ||
import { fileStatusSchema } from 'src/types/file.types'; | ||
import { describe, expect, it } from 'vitest'; | ||
import { FileCardIcon } from '../FileCardIcon'; | ||
|
||
describe('FileCardIcon', () => { | ||
it('should display a video file icon when file status is imported', () => { | ||
render(<FileCardIcon status={fileStatusSchema.enum.imported} />); | ||
|
||
expect(screen.getByTestId('FileCardIcon_fileIcon')).toBeVisible(); | ||
}); | ||
|
||
it('should display a loader icon when file status is converting', () => { | ||
render(<FileCardIcon status={fileStatusSchema.enum.converting} />); | ||
|
||
expect(screen.getByTestId('FileCardIcon_loaderIcon')).toBeVisible(); | ||
}); | ||
|
||
it('should display a check icon when file status is success', () => { | ||
render(<FileCardIcon status={fileStatusSchema.enum.conversionSuccess} />); | ||
|
||
expect(screen.getByTestId('FileCardIcon_checkIcon')).toBeVisible(); | ||
}); | ||
|
||
it('should display an alert icon when file status is error', () => { | ||
render(<FileCardIcon status={fileStatusSchema.enum.conversionError} />); | ||
|
||
expect(screen.getByTestId('FileCardIcon_alertIcon')).toBeVisible(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export { FileCard } from './FileCard'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.