Implement Code feature control (#35115)

* update security api tests

* rough POC to migrate Code to use Feature Controls

* fix tests

* [Code]: Integrate with Feature control

* Rename callWithRequest to callCluster

Author: zfy0701

x-pack/plugins/code/public/actions/index.ts

@@ -11,7 +11,6 @@ export * from './search';
 export * from './file';
 export * from './structure';
 export * from './editor';
-export * from './user';
 export * from './commit';
 export * from './status';
 export * from './project_config';

x-pack/plugins/code/public/actions/user.ts

@@ -4,15 +4,16 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { EuiTab, EuiTabs } from '@elastic/eui';
+import { parse as parseQuery } from 'querystring';
 import React from 'react';
 import { connect } from 'react-redux';
+import { RouteComponentProps, withRouter } from 'react-router-dom';
 import styled from 'styled-components';
 import url from 'url';
 
+import { EuiTab, EuiTabs } from '@elastic/eui';
 import theme from '@elastic/eui/dist/eui_theme_light.json';
-import { parse as parseQuery } from 'querystring';
-import { RouteComponentProps, withRouter } from 'react-router-dom';
+
 import { Repository } from '../../../model';
 import { RootState } from '../../reducers';
 import { EmptyProject } from './empty_project';
@@ -39,7 +40,6 @@ enum AdminTabs {
 interface Props extends RouteComponentProps {
   repositories: Repository[];
   repositoryLoading: boolean;
-  isAdmin: boolean;
 }
 
 interface State {
@@ -120,7 +120,7 @@ class AdminPage extends React.PureComponent<Props, State> {
         const repositoriesCount = this.props.repositories.length;
         const showEmpty = repositoriesCount === 0 && !this.props.repositoryLoading;
         if (showEmpty) {
-          return <EmptyProject isAdmin={this.props.isAdmin} />;
+          return <EmptyProject />;
         }
         return <ProjectTab />;
       }
@@ -142,7 +142,6 @@ class AdminPage extends React.PureComponent<Props, State> {
 const mapStateToProps = (state: RootState) => ({
   repositories: state.repository.repositories,
   repositoryLoading: state.repository.loading,
-  isAdmin: state.userProfile.isCodeAdmin,
 });
 
 export const Admin = withRouter(connect(mapStateToProps)(AdminPage));

x-pack/plugins/code/public/components/admin_page/admin.tsx

@@ -4,26 +4,32 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { EuiButton, EuiFlexGroup, EuiSpacer, EuiText } from '@elastic/eui';
 import React from 'react';
 import { Link } from 'react-router-dom';
+
+import { EuiButton, EuiFlexGroup, EuiSpacer, EuiText } from '@elastic/eui';
+import { uiCapabilities } from 'ui/capabilities';
+
 import { ImportProject } from './import_project';
 
-export const EmptyProject = ({ isAdmin }: { isAdmin: boolean }) => (
-  <div className="code-projects-tab">
-    <EuiSpacer size="xl" />
-    <div className="code-projects-tab__empty_header">
-      <EuiText>
-        <h1>You don't have any projects yet</h1>
-      </EuiText>
-      <EuiText color="subdued">{isAdmin && <p>Let's import your first one</p>}</EuiText>
+export const EmptyProject = () => {
+  const isAdmin = uiCapabilities.code.admin as boolean;
+  return (
+    <div className="code-projects-tab">
+      <EuiSpacer size="xl" />
+      <div className="code-projects-tab__empty_header">
+        <EuiText>
+          <h1>You don't have any projects yet</h1>
+        </EuiText>
+        <EuiText color="subdued">{isAdmin && <p>Let's import your first one</p>}</EuiText>
+      </div>
+      {isAdmin && <ImportProject />}
+      <EuiSpacer />
+      <EuiFlexGroup justifyContent="center">
+        <Link to="/setup-guide">
+          <EuiButton>View the Setup Guide</EuiButton>
+        </Link>
+      </EuiFlexGroup>
     </div>
-    {isAdmin && <ImportProject />}
-    <EuiSpacer />
-    <EuiFlexGroup justifyContent="center">
-      <Link to="/setup-guide">
-        <EuiButton>View the Setup Guide</EuiButton>
-      </Link>
-    </EuiFlexGroup>
-  </div>
-);
+  );
+};

x-pack/plugins/code/public/components/admin_page/empty_project.tsx

@@ -29,6 +29,8 @@ import moment from 'moment';
 import React, { ChangeEvent } from 'react';
 import { connect } from 'react-redux';
 import styled from 'styled-components';
+import { uiCapabilities } from 'ui/capabilities';
+
 import { Repository } from '../../../model';
 import { closeToast, importRepo } from '../../actions';
 import { RepoStatus, RootState } from '../../reducers';
@@ -77,7 +79,6 @@ const sortOptions = [
 interface Props {
   projects: Repository[];
   status: { [key: string]: RepoStatus };
-  isAdmin: boolean;
   importRepo: (repoUrl: string) => void;
   importLoading: boolean;
   toastMessage?: string;
@@ -192,7 +193,7 @@ class CodeProjectTab extends React.PureComponent<Props, State> {
   };
 
   public render() {
-    const { projects, isAdmin, status, toastMessage, showToast, toastType } = this.props;
+    const { projects, status, toastMessage, showToast, toastType } = this.props;
     const projectsCount = projects.length;
     const modal = this.state.showImportProjectModal && this.renderImportModal();
 
@@ -205,7 +206,7 @@ class CodeProjectTab extends React.PureComponent<Props, State> {
         project={repo}
         showStatus={true}
         status={status[repo.uri]}
-        enableManagement={isAdmin}
+        enableManagement={uiCapabilities.code.admin as boolean}
       />
     ));
 
@@ -243,7 +244,7 @@ class CodeProjectTab extends React.PureComponent<Props, State> {
           <EuiFlexItem grow />
           <EuiFlexItem grow />
           <EuiFlexItem>
-            {isAdmin && (
+            {(uiCapabilities.code.admin as boolean) && (
               // @ts-ignore
               <NewProjectButton onClick={this.openModal} data-test-subj="newProjectButton">
                 Add New Project
@@ -270,7 +271,6 @@ class CodeProjectTab extends React.PureComponent<Props, State> {
 const mapStateToProps = (state: RootState) => ({
   projects: state.repository.repositories,
   status: state.status.status,
-  isAdmin: state.userProfile.isCodeAdmin,
   importLoading: state.repository.importLoading,
   toastMessage: state.repository.toastMessage,
   toastType: state.repository.toastType,

x-pack/plugins/code/public/components/admin_page/project_tab.tsx

@@ -18,7 +18,6 @@ import { setup, SetupState } from './setup';
 import { shortcuts, ShortcutsState } from './shortcuts';
 import { RepoState, RepoStatus, status, StatusState } from './status';
 import { symbol, SymbolState } from './symbol';
-import { userProfile, UserProfileState } from './user';
 
 export { RepoState, RepoStatus };
 
@@ -30,7 +29,6 @@ export interface RootState {
   editor: EditorState;
   route: RouteState;
   status: StatusState;
-  userProfile: UserProfileState;
   commit: CommitState;
   blame: BlameState;
   languageServer: LanguageServerState;
@@ -46,7 +44,6 @@ const reducers = {
   search,
   route,
   status,
-  userProfile,
   commit,
   blame,
   languageServer,

x-pack/plugins/code/public/reducers/index.ts

@@ -43,7 +43,6 @@ import {
 import { watchRootRoute } from './setup';
 import { watchRepoCloneSuccess, watchRepoDeleteFinished } from './status';
 import { watchLoadStructure } from './structure';
-import { watchLoadUserProfile } from './user';
 
 export function* rootSaga() {
   yield fork(watchRootRoute);
@@ -63,7 +62,6 @@ export function* rootSaga() {
   yield fork(watchInitRepoCmd);
   yield fork(watchGotoRepo);
   yield fork(watchLoadRepo);
-  yield fork(watchLoadUserProfile);
   yield fork(watchSearchRouteChange);
   yield fork(watchAdminRouteChange);
   yield fork(watchMainRouteChange);

x-pack/plugins/code/public/reducers/user.ts

@@ -25,7 +25,6 @@ import {
   indexRepoFailed,
   indexRepoSuccess,
   initRepoCommand,
-  loadUserProfile,
   updateCloneProgress,
   updateDeleteProgress,
   updateIndexProgress,
@@ -171,7 +170,6 @@ export function* watchGotoRepo() {
 }
 
 function* handleAdminRouteChange() {
-  yield put(loadUserProfile());
   yield put(fetchRepos());
   yield put(fetchRepoConfigs());
   yield put(loadLanguageServers());