refactor: clean up code and improve readability in SidePannel, FileMenu, Scene, and detectModifierKeys and remove settimeout in scene

This commit is contained in:
Poovizhi99 2025-06-13 12:15:29 +05:30
parent ae20cf1437
commit ac78309bcc
4 changed files with 47 additions and 67 deletions

View File

@ -42,7 +42,7 @@ const SidePannel: React.FC<SidePannelProps> = ({ setActiveTab, activeTab }) => {
const projectId = generateProjectId();
useSocketStore.getState().initializeSocket(email, organization, token);
//API for creating new Project
// const project = await createProject(
// projectId,
@ -163,7 +163,10 @@ const SidePannel: React.FC<SidePannelProps> = ({ setActiveTab, activeTab }) => {
<SettingsIcon />
Settings
</div>
<div className="option-list" style={{ cursor: "pointer" }}>
<div className="option-list" style={{ cursor: "pointer" }} onClick={() => {
localStorage.clear();
navigate("/");
}}>
<LogoutIcon />
Log out
</div>

View File

@ -93,9 +93,7 @@ const FileMenu: React.FC = () => {
// console.log('Project update response:', data);
// dashBoardSocket.off("v1-project:response:update", handleResponse); // Clean up
// };
// dashBoardSocket.on("v1-project:response:update", handleResponse);
// dashBoardSocket.emit("v1:project:update", updateProjects);
// }
@ -108,9 +106,7 @@ const FileMenu: React.FC = () => {
projectName
);
//
} catch (error) {
}
} catch (error) {}
};
return (
<button

View File

@ -24,53 +24,30 @@ export default function Scene({ layout }: { readonly layout: 'Main Layout' | 'Co
], []);
const { assets } = useAssetsStore();
const { userId, organization } = getUserData();
const { activeModule } = useModuleStore();
const { projectId } = useParams();
const { projectSocket } = useSocketStore();
const { activeModule } = useModuleStore();
const { loadingProgress } = useLoadingProgress();
const handleUpdatingProject = async () => {
if (!projectId) return;
if (!projectId && loadingProgress > 1) return;
try {
const projects = await getAllProjects(userId, organization);
let projectUuid = projects.Projects.find(
(val: any) => val.projectUuid === projectId || val._id === projectId
);
if (activeModule === "builder" && loadingProgress !== 1) {
const canvas =
document.getElementById("sceneCanvas")?.children[0]?.children[0];
const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
setTimeout(() => {
const updateProjects = {
projectId: projectUuid,
organization,
userId,
projectName: projectUuid.projectName,
thumbnail: screenshotDataUrl,
};
if (projectSocket) {
projectSocket.emit("v1:project:update", updateProjects);
}
}, 8000);
} else {
const canvas =
document.getElementById("sceneCanvas")?.children[0]?.children[0];
const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
const updateProjects = {
projectId: projectUuid,
organization,
userId,
projectName: projectUuid.projectName,
thumbnail: screenshotDataUrl,
};
// console.log('screenshotDataUrl: ', screenshotDataUrl);
// console.log('updateProjects: ', updateProjects);
if (projectSocket) {
projectSocket.emit("v1:project:update", updateProjects);
}
const canvas =
document.getElementById("sceneCanvas")?.children[0]?.children[0];
const screenshotDataUrl = (canvas as HTMLCanvasElement)?.toDataURL("image/png");
const updateProjects = {
projectId: projectUuid,
organization,
userId,
projectName: projectUuid.projectName,
thumbnail: screenshotDataUrl,
};
if (projectSocket) {
projectSocket.emit("v1:project:update", updateProjects);
}
} catch (error) { }
};
useEffect(() => {

View File

@ -1,31 +1,35 @@
// Function to detect if Shift, Ctrl, Alt, or combinations are pressed
// and return the corresponding key combination string
export const detectModifierKeys = (event: KeyboardEvent): string => {
const modifiers = [
event.ctrlKey ? "Ctrl" : "",
event.altKey ? "Alt" : "",
event.shiftKey ? "Shift" : "",
event.metaKey ? "Meta" : "" // Add support for Command/Win key
].filter(Boolean);
const modifiers = [
event.ctrlKey ? "Ctrl" : "",
event.altKey ? "Alt" : "",
event.shiftKey ? "Shift" : "",
event.metaKey ? "Meta" : "", // Add support for Command/Win key
].filter(Boolean);
// Ignore modifier keys when they're pressed alone
const isModifierKey = [
"Control", "Shift", "Alt", "Meta",
"Ctrl", "AltGraph", "OS" // Additional modifier key aliases
].includes(event.key);
// Ignore modifier keys when they're pressed alone
const isModifierKey = [
"Control",
"Shift",
"Alt",
"Meta",
"Ctrl",
"AltGraph",
"OS", // Additional modifier key aliases
].includes(event.key);
const mainKey = isModifierKey ? "" : event.key.toUpperCase();
const mainKey = isModifierKey ? "" : event.key.toUpperCase();
// Handle special cases for keys with different representations
const normalizedKey = mainKey === " " ? "Space" : mainKey;
// Handle special cases for keys with different representations
const normalizedKey = mainKey === " " ? "Space" : mainKey;
// Build the combination string
if (modifiers.length > 0 && normalizedKey) {
return `${modifiers.join("+")}+${normalizedKey}`;
} else if (modifiers.length > 0) {
return modifiers.join("+");
} else {
return normalizedKey;
}
// Build the combination string
if (modifiers.length > 0 && normalizedKey) {
return `${modifiers.join("+")}+${normalizedKey}`;
} else if (modifiers.length > 0) {
return modifiers.join("+");
} else {
return normalizedKey;
}
};