Skip to content

feat: UI UX Update to react #219

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

Jump to bottom
Draft
wants to merge 145 commits into
base: dev
Choose a base branch
from
Draft

feat: UI UX Update to react #219

wants to merge 145 commits into from
+19,458 −17

Conversation

Fr4nc3
Copy link
Collaborator

@Fr4nc3 Fr4nc3 commented May 19, 2025 •
edited
Loading

Purpose

  • New React frontend environment

Does this introduce a breaking change?

  • Yes
  • No

How to Test

  • Get the code
git clone [repo-address]
cd [repo-name]
git checkout [branch-name]
npm install
  • Test the code
npm run test
# or manually test by navigating to the tuition assistance form and submitting completed grades

What to Check

Verify that the following are valid:

  • Completed grades can be submitted without error.
  • The form behaves as expected across different browsers.
  • No regressions in other parts of the tuition assistance workflow.

@Fr4nc3 Fr4nc3 requested a review from marktayl1 May 19, 2025 13:13
@Fr4nc3 Fr4nc3 changed the base branch from dev to main May 19, 2025 13:14
github-advanced-security[bot]
github-advanced-security bot found potential problems Jun 4, 2025
View reviewed changes
src/frontend_react/src/services/TaskService.tsx
* @returns Promise with the response containing session and plan IDs
*/
static async submitInputTask(description: string): Promise<InputTaskResponse> {
const sessionId = this.generateSessionId();

Check failure

Code scanning / CodeQL

Insecure randomness High

This uses a cryptographically insecure random number generated at
Math.random()
Loading
in a security context.

Copilot Autofix

AI 6 days ago

To fix the issue, replace the use of Math.random() with a cryptographically secure random number generator. For JavaScript in the browser, crypto.getRandomValues can be used to generate secure random values. This ensures that the session ID is unpredictable and resistant to attacks.

The generateSessionId() method should be updated to use crypto.getRandomValues to generate the random component of the session ID. Specifically:

  1. Import the crypto module if necessary (for Node.js environments).
  2. Replace Math.random() with crypto.getRandomValues(new Uint32Array(1))[0] to generate a secure random number.
  3. Ensure the random number is formatted appropriately (e.g., within the desired range).
Suggested changeset 1
src/frontend_react/src/services/TaskService.tsx

Autofix patch

Autofix patch
Run the following command in your local git repository to apply this patch
cat << 'EOF' | git apply
diff --git a/src/frontend_react/src/services/TaskService.tsx b/src/frontend_react/src/services/TaskService.tsx
--- a/src/frontend_react/src/services/TaskService.tsx
+++ b/src/frontend_react/src/services/TaskService.tsx
@@ -1,2 +1,3 @@
 import { PlanWithSteps, PlanStatus } from '../models';
+import { crypto } from 'crypto';
 import { Task } from '../models/taskList';
@@ -87,3 +88,3 @@
         const timestamp = new Date().getTime();
-        const random = Math.floor(Math.random() * 10000);
+        const random = crypto.getRandomValues(new Uint32Array(1))[0] % 10000;
         return `sid_${timestamp}_${random}`;
EOF
@@ -1,2 +1,3 @@
import { PlanWithSteps, PlanStatus } from '../models';
import { crypto } from 'crypto';
import { Task } from '../models/taskList';
@@ -87,3 +88,3 @@
const timestamp = new Date().getTime();
const random = Math.floor(Math.random() * 10000);
const random = crypto.getRandomValues(new Uint32Array(1))[0] % 10000;
return `sid_${timestamp}_${random}`;
Copilot is powered by AI and may make mistakes. Always verify output.
Copilot

This comment was marked as outdated.

Sign in to view

Copilot

This comment was marked as outdated.

Sign in to view

Eunsoo Lee and others added 19 commits June 16, 2025 17:23
Update InlineToaster.tsx
28acfa9
@Fr4nc3
add the enter action
eacee03
@Fr4nc3
Merge branch 'ui-ux-refresh_eunsoo' into feature/ui-ux-refresh
875d8d6
Minor changes
6d444c7 
- Disabled input field option
- Chat icon in PlanPage
- AI-generated type fixed
- Fluent foreground color on user message light mode
@Ravikirana-Microsoft
Bug Fix #19325
284c7a0
@Ravikirana-Microsoft
unused code removed
f68a384
@Fr4nc3
Merge branch 'ui-ux-refresh_eunsoo' into feature/ui-ux-refresh
de88da5
@Fr4nc3
Merge pull request #272 from microsoft/ui-ux-refresh-bug-fixes
e792092 
fix: UI ux refresh bug fixes
Major changes
8710868 
- Scroll to bottom on load and new message
- Task / Subtask visual haul
- Carats in PanelLeft fixed
- Shortened task titles
- Removed Content panel title icons
- Sample data... visual haul
- Progress ring is now a Coral component
@Fr4nc3
Bring eunsoo changes
8ef3653
@Fr4nc3
conciliate merge from eunsoo
8407007
@Fr4nc3
clean chat after clarification
98d3e2a
@Fr4nc3
partial fix for final call
9e09257
Major changes
db5c031 
- Favicon added
- Left Nav accessibility issue resolved
- "New Task" focuses input
- Potential fix for Approve and Reject button wrapping
- Guess to Guest typo resolved
- Progress ring background color fix
- Aligned progress list tracker to Figma designs
@Ravikirana-Microsoft
Bug Fix #19398, #19280
05c932d
@Fr4nc3
Merge branch 'ui-ux-refresh_eunsoo' into feature/ui-ux-refresh
e598fda
@Fr4nc3
Merge pull request #274 from microsoft/ui-ux-refresh-bug-fixes
a2a60a0 
fix: Bug Fix #19398, #19280
@Fr4nc3
conciliate code
a9e2097
@Fr4nc3
Merge remote-tracking branch 'upstream/dev' into feature/ui-ux-refresh
1228620
@Fr4nc3 Fr4nc3 changed the title Feature/UI ux refresh feat: UI UX Update to react Jun 18, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

Copilot code review Copilot Copilot left review comments

@marktayl1 marktayl1 Awaiting requested review from marktayl1 marktayl1 is a code owner

@Avijit-Microsoft Avijit-Microsoft Awaiting requested review from Avijit-Microsoft Avijit-Microsoft will be requested when the pull request is marked ready for review Avijit-Microsoft is a code owner

@Roopan-Microsoft Roopan-Microsoft Awaiting requested review from Roopan-Microsoft Roopan-Microsoft will be requested when the pull request is marked ready for review Roopan-Microsoft is a code owner

@Prajwal-Microsoft Prajwal-Microsoft Awaiting requested review from Prajwal-Microsoft Prajwal-Microsoft will be requested when the pull request is marked ready for review Prajwal-Microsoft is a code owner

@Vinay-Microsoft Vinay-Microsoft Awaiting requested review from Vinay-Microsoft Vinay-Microsoft will be requested when the pull request is marked ready for review Vinay-Microsoft is a code owner

@aniaroramsft aniaroramsft Awaiting requested review from aniaroramsft aniaroramsft will be requested when the pull request is marked ready for review aniaroramsft is a code owner

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@Fr4nc3 @marktayl1 @Ravikirana-Microsoft