UniqAI/hexabot
1
0
Fork 0
mirror of https://github.com/hexastack/hexabot synced 2025-04-05 13:35:20 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix: widget FileButton to use mime types

Browse Source
This commit is contained in:
abdou6666 2025-01-30 12:51:42 +01:00
parent 0f5a67c2ce
commit b534e47edd
2 changed files with 49 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
widget/src/components/buttons/FileButton.tsx
View File

@ -1,14 +1,16 @@
/*
* Copyright © 2024 Hexastack. All rights reserved.
* Copyright © 2025 Hexastack. All rights reserved.
*
* Licensed under the GNU Affero General Public License v3.0 (AGPLv3) with the following additional terms:
* 1. The name "Hexabot" is a trademark of Hexastack. You may not use this name in derivative works without express written permission.
* 2. All derivative works must include clear attribution to the original creator and software, Hexastack and Hexabot, in a prominent location (e.g., in the software's "About" section, documentation, and README file).
*/
import React, { ChangeEvent } from "react";
import React, { ChangeEvent, useMemo } from "react";
import { useChat } from "../../providers/ChatProvider";
import { MIME_TYPES } from "../../utils/attachment";
import FileInputIcon from "../icons/FileInputIcon";
import "./FileButton.scss";
@ -23,12 +25,17 @@ const FileButton: React.FC = () => {
setFile && setFile(e.target.files[0]);
}
};
const acceptedMimeTypes = useMemo(
() => Object.values(MIME_TYPES).flat().join(""),
[],
);
return (
<div className="sc-user-input--file-wrapper">
<button className="sc-user-input--file-icon-wrapper" type="button">
<FileInputIcon />
<input
accept={acceptedMimeTypes}
type="file"
id="file-input"
onChange={handleChange}

41
widget/src/utils/attachment.ts
View File

@ -1,11 +1,12 @@
/*
* Copyright © 2024 Hexastack. All rights reserved.
* Copyright © 2025 Hexastack. All rights reserved.
*
* Licensed under the GNU Affero General Public License v3.0 (AGPLv3) with the following additional terms:
* 1. The name "Hexabot" is a trademark of Hexastack. You may not use this name in derivative works without express written permission.
* 2. All derivative works must include clear attribution to the original creator and software, Hexastack and Hexabot, in a prominent location (e.g., in the software's "About" section, documentation, and README file).
*/
import { FileType } from "../types/message.types";
export function getFileType(mimeType: string): FileType {
@ -19,3 +20,41 @@ export function getFileType(mimeType: string): FileType {
return FileType.file;
}
}
export const MIME_TYPES = {
images: ["image/jpeg", "image/png", "image/webp", "image/bmp"],
videos: [
"video/mp4",
"video/webm",
"video/ogg",
"video/quicktime", // common in apple devices
"video/x-msvideo", // AVI
"video/x-matroska", // MKV
],
audios: [
"audio/mpeg", // MP3
"audio/mp3", // Explicit MP3 type
"audio/ogg",
"audio/wav",
"audio/aac", // common in apple devices
"audio/x-wav",
],
documents: [
"application/pdf",
"application/msword", // older ms Word format
"application/vnd.openxmlformats-officedocument.wordprocessingml.document", // newer ms word format
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
"application/vnd.ms-excel", // older excel format
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", // newer excel format
"application/vnd.ms-powerpoint",
"application/vnd.openxmlformats-officedocument.presentationml.presentation",
"text/plain",
"application/rtf",
"application/epub+zip",
"application/x-7z-compressed",
"application/zip",
"application/x-rar-compressed",
"application/json",
"text/csv",
],
};