Skip to content

Fix: Add Full Screen mode and update Tabs syntax#128

Merged
ubaidsk merged 1 commit intolfortran:mainfrom
amritamishra01:add-fullscreen-mode
Feb 21, 2026
Merged

Fix: Add Full Screen mode and update Tabs syntax#128
ubaidsk merged 1 commit intolfortran:mainfrom
amritamishra01:add-fullscreen-mode

Conversation

@amritamishra01
Copy link
Contributor

This PR adds a responsive Full Screen mode to provide a distraction-free environment for users. It also updates the Tabs and Dropdown components to use the modern items and menu props to resolve console deprecation warnings.

steps:
Fullscreen Toggle: The page successfully enters a distraction-free fullscreen mode when you click the button, removing browser menus and the URL bar as requested.

State Management: The button correctly updates from "Fullscreen" to "Exit Fullscreen" once the mode is active, providing clear user feedback.

Responsive Layout: In the mobile view (around 0:20 in the video), the button intelligently collapses to show only the icon, preventing header clutter while maintaining the "Run" text.

Exit Modes: The application accurately handles exiting fullscreen through both the button click and the browser's native Esc key.

Closes #113

@amritamishra01
Copy link
Contributor Author

pr.mp4

Hi @ubaidsk ,you can check this out !

Copy link
Member

@ubaidsk ubaidsk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested this on Edge, Safari, and Brave browsers. It works like a charm. There are no console errors as well. Thank you so much for implementing this. Could you please remove the following code comments? I think they are not necessary.

Once these review comments are addressed, I think this would be good to merge!

@@ -1,13 +1,34 @@
import { Button, Tabs, Dropdown, Menu, Space } from "antd";
import { Button, Tabs, Dropdown, Menu, Space } from "antd"; // Restored Menu
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
import { Button, Tabs, Dropdown, Menu, Space } from "antd"; // Restored Menu
import { Button, Tabs, Dropdown, Menu, Space } from "antd";

import { DownOutlined, PlayCircleOutlined } from "@ant-design/icons";
import { DownOutlined, PlayCircleOutlined,FullscreenOutlined,FullscreenExitOutlined} from "@ant-design/icons";
import { useIsMobile } from "./useIsMobile";
import React, { useState, useEffect } from 'react'; // Added useEffect
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
import React, { useState, useEffect } from 'react'; // Added useEffect
import React, { useState, useEffect } from 'react';

Comment on lines +13 to +15
const isMobile = useIsMobile(); // ADDED THIS
// ADDED THIS FUNCTION
const [isFullScreen, setIsFullScreen] = useState(false);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
const isMobile = useIsMobile(); // ADDED THIS
// ADDED THIS FUNCTION
const [isFullScreen, setIsFullScreen] = useState(false);
const isMobile = useIsMobile();
const [isFullScreen, setIsFullScreen] = useState(false);

<Tabs
tabBarExtraContent={extraOperations}
style={{ height: "100%" }}
items={tabItems} // UPDATED TO MODERN SYNTAX
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
items={tabItems} // UPDATED TO MODERN SYNTAX
items={tabItems}

@amritamishra01
Copy link
Contributor Author

I have addressed the feedback and removed all internal comments/notes from the code. Ready for final review! CC: @ubaidsk

Copy link
Member

@ubaidsk ubaidsk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, thank you for fixing this, great work!

@ubaidsk ubaidsk merged commit 62fa662 into lfortran:main Feb 21, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add full screen mode

2 participants