feat: Moves Profile to Single Page App (SPA)

superset-frontend/src/features/home/RightMenu.tsx

@@ -474,7 +474,7 @@ const RightMenu = ({
             <Menu.ItemGroup key="user-section" title={t('User')}>
               {navbarRight.user_profile_url && (
                 <Menu.Item key="profile">
-                  <a href={navbarRight.user_profile_url}>{t('Profile')}</a>
+                  <Link to={navbarRight.user_profile_url}>{t('Profile')}</Link>
                 </Menu.Item>
               )}
               {navbarRight.user_info_url && (

superset-frontend/src/profile/components/CreatedContent.test.tsx → superset-frontend/src/features/profile/CreatedContent.test.tsx

@@ -20,8 +20,8 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import thunk from 'redux-thunk';
 import configureStore from 'redux-mock-store';
-import CreatedContent from 'src/profile/components/CreatedContent';
 import TableLoader from 'src/components/TableLoader';
+import CreatedContent from './CreatedContent';
 
 import { user } from './fixtures';
 

superset-frontend/src/profile/components/Favorites.test.tsx → superset-frontend/src/features/profile/Favorites.test.tsx

@@ -20,8 +20,8 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import thunk from 'redux-thunk';
 import configureStore from 'redux-mock-store';
-import Favorites from 'src/profile/components/Favorites';
 import TableLoader from 'src/components/TableLoader';
+import Favorites from './Favorites';
 
 import { user } from './fixtures';
 

superset-frontend/src/profile/components/Favorites.tsx → superset-frontend/src/features/profile/Favorites.tsx

@@ -22,7 +22,7 @@ import moment from 'moment';
 import { t } from '@superset-ui/core';
 import { DashboardResponse, BootstrapUser } from 'src/types/bootstrapTypes';
 import TableLoader from '../../components/TableLoader';
-import { Chart } from '../types';
+import { Chart } from './types';
 
 interface FavoritesProps {
   user: BootstrapUser;

superset-frontend/src/profile/components/RecentActivity.test.tsx → superset-frontend/src/features/profile/RecentActivity.test.tsx

@@ -18,8 +18,8 @@
  */
 import React from 'react';
 import { shallow } from 'enzyme';
-import RecentActivity from 'src/profile/components/RecentActivity';
 import TableLoader from 'src/components/TableLoader';
+import RecentActivity from './RecentActivity';
 
 import { user } from './fixtures';
 

superset-frontend/src/profile/components/RecentActivity.tsx → superset-frontend/src/features/profile/RecentActivity.tsx

@@ -20,10 +20,9 @@ import React from 'react';
 import moment from 'moment';
 import { t } from '@superset-ui/core';
 import rison from 'rison';
-
-import TableLoader from '../../components/TableLoader';
-import { ActivityResult } from '../types';
-import { BootstrapUser } from '../../types/bootstrapTypes';
+import TableLoader from 'src/components/TableLoader';
+import { BootstrapUser } from 'src/types/bootstrapTypes';
+import { ActivityResult } from './types';
 
 interface RecentActivityProps {
   user: BootstrapUser;

superset-frontend/src/profile/components/Security.test.tsx → superset-frontend/src/features/profile/Security.test.tsx

@@ -18,9 +18,9 @@
  */
 import React from 'react';
 import { styledMount as mount } from 'spec/helpers/theming';
-import Security from 'src/profile/components/Security';
 import Label from 'src/components/Label';
 import { user, userNoPerms } from './fixtures';
+import Security from './Security';
 
 describe('Security', () => {
   const mockedProps = {

superset-frontend/src/profile/components/UserInfo.test.tsx → superset-frontend/src/features/profile/UserInfo.test.tsx

@@ -19,7 +19,7 @@
 import React from 'react';
 import Gravatar from 'react-gravatar';
 import { mount } from 'enzyme';
-import UserInfo from 'src/profile/components/UserInfo';
+import UserInfo from './UserInfo';
 
 import { user } from './fixtures';
 

superset-frontend/src/profile/components/App.test.tsx → superset-frontend/src/pages/Profile/Profile.test.tsx

@@ -19,26 +19,25 @@
 import React from 'react';
 import { Row, Col } from 'src/components';
 import { shallow } from 'enzyme';
-import App from 'src/profile/components/App';
+import Profile from 'src/pages/Profile';
+import { user } from 'src/features/profile/fixtures';
 
-import { user } from './fixtures';
-
-describe('App', () => {
+describe('Profile', () => {
   const mockedProps = {
     user,
   };
   it('is valid', () => {
-    expect(React.isValidElement(<App {...mockedProps} />)).toBe(true);
+    expect(React.isValidElement(<Profile {...mockedProps} />)).toBe(true);
   });
 
   it('renders 2 Col', () => {
-    const wrapper = shallow(<App {...mockedProps} />);
+    const wrapper = shallow(<Profile {...mockedProps} />);
     expect(wrapper.find(Row)).toExist();
     expect(wrapper.find(Col)).toHaveLength(2);
   });
 
   it('renders 4 Tabs', () => {
-    const wrapper = shallow(<App {...mockedProps} />);
+    const wrapper = shallow(<Profile {...mockedProps} />);
     expect(wrapper.find('[tab]')).toHaveLength(4);
   });
 });

superset-frontend/src/profile/components/App.tsx → superset-frontend/src/pages/Profile/index.tsx

@@ -21,11 +21,11 @@ import { t, styled } from '@superset-ui/core';
 import { Row, Col } from 'src/components';
 import Tabs from 'src/components/Tabs';
 import { BootstrapUser } from 'src/types/bootstrapTypes';
-import Favorites from './Favorites';
-import UserInfo from './UserInfo';
-import Security from './Security';
-import RecentActivity from './RecentActivity';
-import CreatedContent from './CreatedContent';
+import Favorites from 'src/features/profile/Favorites';
+import UserInfo from 'src/features/profile/UserInfo';
+import Security from 'src/features/profile/Security';
+import RecentActivity from 'src/features/profile/RecentActivity';
+import CreatedContent from 'src/features/profile/CreatedContent';
 
 interface AppProps {
   user: BootstrapUser;

superset-frontend/src/views/routes.tsx

@@ -119,6 +119,10 @@ const RowLevelSecurityList = lazy(
     ),
 );
 
+const Profile = lazy(
+  () => import(/* webpackChunkName: "Profile" */ 'src/pages/Profile'),
+);
+
 type Routes = {
   path: string;
   Component: React.ComponentType;
@@ -217,6 +221,10 @@ export const routes: Routes = [
     path: '/rowlevelsecurity/list',
     Component: RowLevelSecurityList,
   },
+  {
+    path: '/profile',
+    Component: Profile,
+  },
 ];
 
 if (isFeatureEnabled(FeatureFlag.TAGGING_SYSTEM)) {

superset-frontend/webpack.config.js

@@ -212,7 +212,6 @@ const config = {
     spa: addPreamble('/src/views/index.tsx'),
     embedded: addPreamble('/src/embedded/index.tsx'),
     sqllab: addPreamble('/src/SqlLab/index.tsx'),
-    profile: addPreamble('/src/profile/index.tsx'),
     showSavedQuery: [path.join(APP_DIR, '/src/showSavedQuery/index.jsx')],
   },
   output,

superset/initialization/__init__.py

@@ -182,6 +182,7 @@ def init_views(self) -> None:
         from superset.views.key_value import KV
         from superset.views.log.api import LogRestApi
         from superset.views.log.views import LogModelView
+        from superset.views.profile import ProfileView
         from superset.views.redirects import R
         from superset.views.sql_lab.views import (
             SavedQueryView,
@@ -309,6 +310,7 @@ def init_views(self) -> None:
         appbuilder.add_view_no_menu(ExplorePermalinkView)
         appbuilder.add_view_no_menu(KV)
         appbuilder.add_view_no_menu(R)
+        appbuilder.add_view_no_menu(ProfileView)
         appbuilder.add_view_no_menu(SavedQueryView)
         appbuilder.add_view_no_menu(SavedQueryViewApi)
         appbuilder.add_view_no_menu(SliceAsync)

superset/views/base.py

@@ -406,7 +406,7 @@ def menu_data(user: User) -> dict[str, Any]:
             "user_login_url": appbuilder.get_url_for_login,
             "user_profile_url": None
             if user.is_anonymous or is_feature_enabled("MENU_HIDE_USER_INFO")
-            else "/superset/profile/",
+            else "/profile/",
             "locale": session.get("locale", "en"),
         },
     }

superset/views/core.py

@@ -80,7 +80,6 @@
     base_json_conv,
     DatasourceType,
     get_user_id,
-    get_username,
     ReservedUrlParameters,
 )
 from superset.views.base import (
@@ -985,24 +984,9 @@ def welcome(self) -> FlaskResponse:
     @has_access
     @event_logger.log_this
     @expose("/profile/")
+    @deprecated(new_target="/profile")
     def profile(self) -> FlaskResponse:
-        """User profile page"""
-        user = g.user if hasattr(g, "user") and g.user else None
-        if not user or security_manager.is_guest_user(user) or user.is_anonymous:
-            abort(404)
-        payload = {
-            "user": bootstrap_user_data(user, include_perms=True),
-            "common": common_bootstrap_payload(user),
-        }
-
-        return self.render_template(
-            "superset/basic.html",
-            title=_("%(user)s's profile", user=get_username()),
-            entry="profile",
-            bootstrap_data=json.dumps(
-                payload, default=utils.pessimistic_json_iso_dttm_ser
-            ),
-        )
+        return redirect("/profile/")
 
     @has_access
     @event_logger.log_this

superset/views/profile.py

@@ -0,0 +1,40 @@
+# Licensed to the Apache Software Foundation (ASF) under one
+# or more contributor license agreements.  See the NOTICE file
+# distributed with this work for additional information
+# regarding copyright ownership.  The ASF licenses this file
+# to you under the Apache License, Version 2.0 (the
+# "License"); you may not use this file except in compliance
+# with the License.  You may obtain a copy of the License at
+#
+#   http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing,
+# software distributed under the License is distributed on an
+# "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+# KIND, either express or implied.  See the License for the
+# specific language governing permissions and limitations
+# under the License.
+from flask import abort, g
+from flask_appbuilder import permission_name
+from flask_appbuilder.api import expose
+from flask_appbuilder.security.decorators import has_access
+
+from superset import event_logger, security_manager
+from superset.superset_typing import FlaskResponse
+
+from .base import BaseSupersetView
+
+
+class ProfileView(BaseSupersetView):
+    route_base = "/profile"
+    class_permission_name = "Profile"
+
+    @expose("/")
+    @has_access
+    @permission_name("read")
+    @event_logger.log_this
+    def root(self) -> FlaskResponse:
+        user = g.user if hasattr(g, "user") and g.user else None
+        if not user or security_manager.is_guest_user(user) or user.is_anonymous:
+            abort(404)
+        return super().render_app_template()