Skip to content

[MKT-778]fix/handle unsupported file types gracefully for metadata remover #1825

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jaaaaavier merged 3 commits into from
Mar 9, 2026
Merged

[MKT-778]fix/handle unsupported file types gracefully for metadata remover #1825

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3a117e5
feat: update metadata remover
jaaaaavier Mar 9, 2026
60b8b3c
Merge branch 'main' into improves/sonar-quality
jaaaaavier Mar 9, 2026
29adb9a
Merge branch 'main' into improves/sonar-quality
jaaaaavier Mar 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 40 additions & 5 deletions src/components/metadata-remover/HeroSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,22 @@
import { CheckCircle } from '@phosphor-icons/react';
import Image from 'next/legacy/image';
import { MetadataRemoverText } from '@/assets/types/metadata-remover';
import { removeMetadata as removeFileMetadata } from '@/lib/metadataRemover';
import { removeMetadata as removeFileMetadata, SUPPORTED_TYPES } from '@/lib/metadataRemover';

interface HeroSectionProps {
textContent: MetadataRemoverText['HeroSection'];
lang: string;
}

const HeroSection = ({ textContent }: HeroSectionProps): JSX.Element => {

Check failure on line 14 in src/components/metadata-remover/HeroSection.tsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Refactor this function to reduce its Cognitive Complexity from 19 to the 15 allowed. 


See more on https://sonarcloud.io/project/issues?id=internxt_website&issues=AZzRs0UTMVxjo9SILSZF&open=AZzRs0UTMVxjo9SILSZF&pullRequest=1825
const [isSelectedFile, setIsSelectedFile] = useState(false);
const [isProcessing, setIsProcessing] = useState(false);
const [isError, setIsError] = useState(false);
const [isProcessFinished, setIsProcessFinished] = useState(false);
const [setProcessResult] = useState<any>(null);
const [processResult, setProcessResult] = useState<any>(null);

Check warning on line 19 in src/components/metadata-remover/HeroSection.tsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Remove this useless assignment to variable "processResult". 


See more on https://sonarcloud.io/project/issues?id=internxt_website&issues=AZzRs0UTMVxjo9SILSZG&open=AZzRs0UTMVxjo9SILSZG&pullRequest=1825
const [dragEnter, setDragEnter] = useState(false);
const [fileSizeLimitReached, setFileSizeLimitReached] = useState(false);
const [isUnsupportedType, setIsUnsupportedType] = useState(false);
const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
const uploadFileRef = createRef<HTMLInputElement>();
const [file, setFile] = useState<File | null>(null);
Expand Down Expand Up @@ -93,11 +94,13 @@
setIsProcessing(false);
setIsProcessFinished(false);
setIsError(false);
setIsUnsupportedType(false);
setFile(null);
};

const handleCancelProcess = () => {
setIsSelectedFile(false);
setIsUnsupportedType(false);
};

const handleConfirmProcess = () => {
Expand All @@ -110,11 +113,15 @@
if (fileInput?.files) {
setDragEnter(false);
setFileSizeLimitReached(false);
setIsUnsupportedType(false);
setIsSelectedFile(true);
if (fileInput.files[0] && fileInput.files[0].size >= maxFileSize) {
const selectedFile = fileInput.files[0];
if (selectedFile && !SUPPORTED_TYPES.includes(selectedFile.type)) {
setIsUnsupportedType(true);
} else if (selectedFile && selectedFile.size >= maxFileSize) {
setFileSizeLimitReached(true);
} else {
setFile(fileInput.files[0]);
setFile(selectedFile);
}
} else {
console.error('No files to process');
Expand Down Expand Up @@ -303,76 +310,104 @@
</>
) : (
<>
{fileSizeLimitReached ? (
{isUnsupportedType ? (
<>
<div className="flex h-60 w-full flex-col items-center justify-center rounded-xl bg-opacity-3 sm:h-96">
<Transition
as="div"
show={isSelectedFile}
enter="transition duration-200 ease-out"
enterFrom="opacity-0 translate-y-2"
enterTo="opacity-100 translate-y-0"
>
<div className="flex flex-col items-center space-y-6">
<div className="flex flex-col items-center space-y-2">
<p className="text-2xl font-medium">{textContent.error.title}</p>
<p className="text-xl text-cool-gray-60">File type not supported</p>
</div>
<button
type="button"
className="flex h-10 flex-row items-center rounded-lg bg-primary px-5 font-medium text-white transition duration-150 ease-out active:scale-98"
onClick={() => {
handleCancelProcess();
}}
>
{textContent.scanAgain}
</button>
</div>
</Transition>
</div>
</>

Check warning on line 340 in src/components/metadata-remover/HeroSection.tsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

A fragment with only one child is redundant. 


See more on https://sonarcloud.io/project/issues?id=internxt_website&issues=AZzRs0UTMVxjo9SILSZH&open=AZzRs0UTMVxjo9SILSZH&pullRequest=1825
) : fileSizeLimitReached ? (
<>
<div className="flex h-60 w-full flex-col items-center justify-center rounded-xl bg-opacity-3 sm:h-96">
<Transition
as="div"
show={isSelectedFile}
enter="transition duration-200 ease-out"
enterFrom="opacity-0 translate-y-2"
enterTo="opacity-100 translate-y-0"
>
<div className="flex flex-col items-center space-y-6">
<div className="flex flex-col items-center">
<p className="text-2xl font-medium">{textContent.maxFileSize.title}</p>
<p className="text-xl text-cool-gray-60">{textContent.maxFileSize.description}</p>
</div>
<button
type="button"
className="flex h-10 flex-row items-center rounded-lg bg-primary px-5 font-medium text-white transition duration-150 ease-out active:scale-98"
onClick={() => {
handleCancelProcess();
}}
>
{textContent.scanAgain}
</button>
</div>
</Transition>
</div>
</>
) : (
<>
<div className="flex h-60 w-full flex-col items-stretch justify-center rounded-xl bg-opacity-3 sm:h-96">
<Transition
as="div"
show={isSelectedFile}
enter="transition duration-200 ease-out"
enterFrom="opacity-0 translate-y-2"
enterTo="opacity-100 translate-y-0"
>
<div className="flex w-full flex-col items-center space-y-6">
<div className="flex w-full flex-shrink flex-col items-center overflow-hidden">
<p className="px-4 text-center text-2xl font-medium">{textContent.fileSelected}</p>
<p className="w-full truncate px-10 text-center text-lg font-semibold text-cool-gray-60 lg:w-auto lg:max-w-md xl:max-w-xl">
{file?.name}
</p>
</div>
<div className="flex flex-row items-center justify-center space-x-4">
<button
type="button"
className="flex h-12 flex-row items-center rounded-lg border border-gray-30 bg-white px-6 text-lg font-medium text-black transition duration-150 ease-out active:scale-98 sm:h-10 sm:px-5 sm:text-base"
onClick={() => {
handleCancelProcess();
}}
>
{textContent.cancel}
</button>
<button
type="button"
className="flex h-12 flex-row items-center rounded-lg bg-primary px-6 text-lg font-medium text-white transition duration-150 ease-out active:scale-98 sm:h-10 sm:px-5 sm:text-base"
onClick={() => {
handleConfirmProcess();
}}
>
{textContent.scanNow}
</button>
</div>
</div>
</Transition>
</div>
</>
)}

Check warning on line 410 in src/components/metadata-remover/HeroSection.tsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Extract this nested ternary operation into an independent statement. 


See more on https://sonarcloud.io/project/issues?id=internxt_website&issues=AZzRs0UTMVxjo9SILSZI&open=AZzRs0UTMVxjo9SILSZI&pullRequest=1825
</>
)}
</>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/metadataRemover.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ const SUPPORTED_VIDEO_TYPES = ['video/mp4', 'video/x-m4v', 'video/quicktime', 'v

const SUPPORTED_VISIO_TYPES = ['application/vnd.visio'];

const SUPPORTED_TYPES = [
export const SUPPORTED_TYPES = [
...SUPPORTED_IMAGE_TYPES,
...SUPPORTED_PDF_TYPES,
...SUPPORTED_WORD_TYPES,
Expand Down
Loading