Rucio WebUI Revamp

Description

Rucio is an open-source software framework that provides functionality to scientific collaborations to organize, manage, monitor, and access their distributed data and dataflows across heterogeneous infrastructures. Originally developed to meet the requirements of the high-energy physics experiment ATLAS, Rucio has been continuously enhanced to support diverse scientific communities. Since 2016, Rucio has orchestrated multiple exabytes of data access and data transfers globally.

The Rucio WebUI is a Next.js application utilized by various users within collaborating communities to access, monitor, and manage their distributed data. Key features of the Rucio WebUI include:

SDK for Streaming: Facilitates seamless data streaming from the Rucio server to page components, ensuring a responsive user interface.
Typed in TypeScript with Generics: Strict typing ensures code integrity and enhances development efficiency.
Accessibility and Responsiveness: Designed with accessibility and responsiveness in mind, ensuring usability across various devices.
Testing and Stability: Extensive testing ensures robustness and reliability in all components.
Feature Toggles: Dynamic feature toggles provide flexibility in enabling or disabling specific functionalities as needed.
Component Library: Utilizes Storybook and TailwindCSS to enhance development speed and consistency.

Tasks

Upgrade to Next.js 15, React 19, TailwindCSS 4.x:
- Migrate the existing codebase to Next.js 15 to leverage the latest features and performance improvements.
- Utilize Server Side Rendering and React Query in Client Side Components to enhance data-fetching capabilities.
- Migrate tailwind.config.js to new CSS based configuration for TailwindCSS 4.x.
Enhance User Experience for Site Administrators and Operators:
- Currently the WebUI focuses on List/Get views with the exception of allowing users to Create Rules. Add features to Create/Edit resources for site administrators and operational experts.
- Investigate legacy views in the previous Flask application and migrate them to the new WebUI.
- Redesign these views to be more user-friendly, incorporating feedback from site administrators and operators.
Migrate Authentication to NextAuth (Auth.js):
- Transition existing x509 and user/password authentication mechanisms to NextAuth.
- Ensure compatibility with various authentication flows, including OAuth and OpenID Connect.
- Develop an RBAC system to ensure users have access only to functionalities relevant to their roles, enhancing security and usability.
Transition to a Monorepo Structure:
- Migrate the Rucio WebUI to a monorepo structure to improve code organization and facilitate the sharing of common components across different projects.

Requirements

Mandatory:

Proficiency in React.js and Next.js
Experience with TailwindCSS
Strong knowledge of JavaScript (ECMAScript 6) and TypeScript
Familiarity with Python 3 and Flask
Proficiency with Linux, Git, and Docker

Good to Have:

Understanding of NX Monorepos
Experience with AGGrid Data Tables
Experience with GitHub Actions
Knowledge of HTTP REST APIs
Familiarity with OpenID Connect and x509 protocols

Expected Results

By the end of GSoC 2025, we expect to have a revamped Rucio WebUI that:

Is upgraded to Next.js 15 with integrated React Query.
Utilizes both client and server-side components as per React 19’s stable features.
Supports TailwindCSS 4.0 for a modern design system.
Offers enhanced user experiences tailored for site administrators and operators.
Employs NextAuth for streamlined authentication processes.
Implements a robust RBAC system.
Adopts a monorepo structure for improved code organization and component sharing.

Mentors

Mayank Sharma - University of Michigan, Ann Arbor
Martin Barisits - CERN

Additional Information

Difficulty level (low / medium / high): medium
Duration: 350 hours
Mentor availability: June-November

Corresponding Project

Rucio

Participating Organizations

CERN