diff --git a/frontend/src/component/application/EditApplication.tsx b/frontend/src/component/application/ApplicationEdit.tsx
similarity index 98%
rename from frontend/src/component/application/EditApplication.tsx
rename to frontend/src/component/application/ApplicationEdit.tsx
index d431754d4f..edfd3b1667 100644
--- a/frontend/src/component/application/EditApplication.tsx
+++ b/frontend/src/component/application/ApplicationEdit.tsx
@@ -27,7 +27,7 @@ import useApplication from '../../hooks/api/getters/useApplication/useApplicatio
import { useHistory, useParams } from 'react-router-dom';
import { useLocationSettings } from '../../hooks/useLocationSettings';
-const EditApplication = () => {
+const ApplicationEdit = () => {
const history = useHistory();
const { name } = useParams<{ name: string }>();
const { refetchApplication, application } = useApplication(name);
@@ -36,8 +36,6 @@ const EditApplication = () => {
const { deleteApplication } = useApplicationsApi();
const { locationSettings } = useLocationSettings();
- console.log(locationSettings)
-
const [loading, setLoading] = useState(true);
const [showDialog, setShowDialog] = useState(false);
@@ -153,4 +151,4 @@ const EditApplication = () => {
);
};
-export default EditApplication;
+export default ApplicationEdit;
diff --git a/frontend/src/component/application/ApplicationUpdate.tsx b/frontend/src/component/application/ApplicationUpdate.tsx
index 29c7587472..c6e425aa12 100644
--- a/frontend/src/component/application/ApplicationUpdate.tsx
+++ b/frontend/src/component/application/ApplicationUpdate.tsx
@@ -5,7 +5,23 @@ import icons from './icon-names';
import GeneralSelect from '../common/GeneralSelect/GeneralSelect';
import useApplicationsApi from '../../hooks/api/actions/useApplicationsApi/useApplicationsApi';
-const ApplicationUpdate = ({ application }) => {
+interface IApplication {
+ appName: string;
+ color: string;
+ createdAt: string;
+ description: string;
+ icon: string;
+ instances: [];
+ links: object;
+ seenToggles: [];
+ strategies: [];
+ url: string;
+}
+interface IApplicationUpdateProps {
+ application: IApplication;
+}
+
+const ApplicationUpdate = ({ application }: IApplicationUpdateProps) => {
const { storeApplicationMetaData } = useApplicationsApi();
const { appName, icon, url, description } = application;
const [localUrl, setLocalUrl] = useState(url || '');
diff --git a/frontend/src/component/application/application-edit-component.js b/frontend/src/component/application/application-edit-component.js
deleted file mode 100644
index f242e5b37c..0000000000
--- a/frontend/src/component/application/application-edit-component.js
+++ /dev/null
@@ -1,196 +0,0 @@
-/* eslint react/no-multi-comp:off */
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-
-import {
- Avatar,
- Link,
- Icon,
- IconButton,
- Button,
- LinearProgress,
- Typography,
-} from '@material-ui/core';
-import { Link as LinkIcon } from '@material-ui/icons';
-
-import ConditionallyRender from '../common/ConditionallyRender/ConditionallyRender';
-import {
- formatFullDateTimeWithLocale,
- formatDateWithLocale,
-} from '../common/util';
-import { UPDATE_APPLICATION } from '../providers/AccessProvider/permissions';
-import ApplicationView from './ApplicationView';
-import ApplicationUpdate from './application-update';
-import TabNav from '../common/TabNav/TabNav';
-import Dialogue from '../common/Dialogue';
-import PageContent from '../common/PageContent';
-import HeaderTitle from '../common/HeaderTitle';
-import AccessContext from '../../contexts/AccessContext';
-class ClientApplications extends PureComponent {
- static contextType = AccessContext;
-
- static propTypes = {
- fetchApplication: PropTypes.func.isRequired,
- appName: PropTypes.string,
- application: PropTypes.object,
- locationSettings: PropTypes.object.isRequired,
- storeApplicationMetaData: PropTypes.func.isRequired,
- deleteApplication: PropTypes.func.isRequired,
- history: PropTypes.object.isRequired,
- };
-
- constructor(props) {
- super();
- this.state = {
- activeTab: 0,
- loading: !props.application,
- prompt: false,
- };
- }
-
- componentDidMount() {
- this.props
- .fetchApplication(this.props.appName)
- .finally(() => this.setState({ loading: false }));
- }
- formatFullDateTime = v =>
- formatFullDateTimeWithLocale(v, this.props.locationSettings.locale);
- formatDate = v => formatDateWithLocale(v, this.props.locationSettings.locale);
-
- deleteApplication = async evt => {
- evt.preventDefault();
- // if (window.confirm('Are you sure you want to remove this application?')) {
- const { deleteApplication, appName } = this.props;
- await deleteApplication(appName);
- this.props.history.push('/applications');
- // }
- };
-
- render() {
- if (this.state.loading) {
- return (
-
- );
- } else if (!this.props.application) {
- return Application ({this.props.appName}) not found
;
- }
- const { hasAccess } = this.context;
- const { application, storeApplicationMetaData } = this.props;
- const {
- appName,
- instances,
- strategies,
- seenToggles,
- url,
- description,
- icon = 'apps',
- createdAt,
- } = application;
-
- const toggleModal = () => {
- this.setState(prev => ({ ...prev, prompt: !prev.prompt }));
- };
-
- const renderModal = () => (
-
- );
-
- const tabData = [
- {
- label: 'Application overview',
- component: (
-
- ),
- },
- {
- label: 'Edit application',
- component: (
-
- ),
- },
- ];
-
- return (
-
-
- {icon || 'apps'}
-
- {appName}
-
- }
- actions={
- <>
-
-
-
- }
- />
-
-
- Delete
-
- }
- />
-
- }
- />
- }
- >
-
- {description || ''}
-
- Created: {this.formatDate(createdAt)}
-
-
-
- {renderModal()}
-
-
-
- }
- />
-
- );
- }
-}
-
-export default ClientApplications;
diff --git a/frontend/src/component/application/application-edit-container.jsx b/frontend/src/component/application/application-edit-container.jsx
deleted file mode 100644
index 4c732b0ed5..0000000000
--- a/frontend/src/component/application/application-edit-container.jsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import { connect } from 'react-redux';
-import ApplicationEdit from './application-edit-component';
-import {
- deleteApplication,
- fetchApplication,
- storeApplicationMetaData,
-} from '../../store/application/actions';
-import { useLocationSettings } from '../../hooks/useLocationSettings';
-
-const ApplicationEditContainer = props => {
- const { locationSettings } = useLocationSettings();
-
- return ;
-};
-
-const mapStateToProps = (state, props) => {
- let application = state.applications.getIn(['apps', props.appName]);
- if (application) {
- application = application.toJS();
- }
- return {
- application,
- };
-};
-
-export default connect(mapStateToProps, {
- fetchApplication,
- storeApplicationMetaData,
- deleteApplication,
-})(ApplicationEditContainer);
diff --git a/frontend/src/component/application/application-list-component.js b/frontend/src/component/application/application-list-component.js
deleted file mode 100644
index 65da487cfe..0000000000
--- a/frontend/src/component/application/application-list-component.js
+++ /dev/null
@@ -1,69 +0,0 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
-import { CircularProgress } from '@material-ui/core';
-import { Warning } from '@material-ui/icons';
-
-import { AppsLinkList, styles as commonStyles } from '../common';
-import SearchField from '../common/SearchField/SearchField';
-import PageContent from '../common/PageContent/PageContent';
-import HeaderTitle from '../common/HeaderTitle';
-
-const Empty = () => (
-
-
-
-
- Oh snap, it does not seem like you have connected any applications.
- To connect your application to Unleash you will require a Client
- SDK.
-
-
- You can read more about how to use Unleash in your application in
- the{' '}
- documentation.
-
-
-);
-
-const ClientStrategies = ({ fetchAll, applications }) => {
- const [filter, setFilter] = useState('');
-
- useEffect(() => {
- fetchAll();
- }, [fetchAll]);
-
- const filteredApplications = useMemo(() => {
- const regExp = new RegExp(filter, 'i');
- return filter
- ? applications?.filter(a => regExp.test(a.appName))
- : applications;
- }, [applications, filter]);
-
- if (!filteredApplications) {
- return ;
- }
-
- return (
- <>
-
-
-
- }>
-
- {filteredApplications.length > 0 ? (
-
- ) : (
-
- )}
-