From 6e0c788c98ac43fead4ab0c3c2fe2b2078448a02 Mon Sep 17 00:00:00 2001 From: Eduard Heimbuch Date: Fri, 25 Oct 2019 12:38:48 +0200 Subject: [PATCH] transfer frontend changes to typescript files --- scm-ui/ui-components/src/Breadcrumb.js | 129 ---------- scm-ui/ui-components/src/Breadcrumb.tsx | 7 +- .../src/repos/sources/containers/Sources.js | 230 ------------------ .../src/repos/sources/containers/Sources.tsx | 27 +- 4 files changed, 19 insertions(+), 374 deletions(-) delete mode 100644 scm-ui/ui-components/src/Breadcrumb.js delete mode 100644 scm-ui/ui-webapp/src/repos/sources/containers/Sources.js diff --git a/scm-ui/ui-components/src/Breadcrumb.js b/scm-ui/ui-components/src/Breadcrumb.js deleted file mode 100644 index c063c3beba..0000000000 --- a/scm-ui/ui-components/src/Breadcrumb.js +++ /dev/null @@ -1,129 +0,0 @@ -//@flow -import React from "react"; -import { Link } from "react-router-dom"; -import { translate } from "react-i18next"; -import classNames from "classnames"; -import styled from "styled-components"; -import { binder, ExtensionPoint } from "@scm-manager/ui-extensions"; -import type { Branch, Repository } from "@scm-manager/ui-types"; -import Icon from "./Icon"; - -type Props = { - repository: Repository, - branch: Branch, - defaultBranch: Branch, - branches: Branch[], - revision: string, - path: string, - baseUrl: string, - - // Context props - t: string => string -}; - -const FlexStartNav = styled.nav` - flex: 1; -`; - -const HomeIcon = styled(Icon)` - line-height: 1.5rem; -`; - -const ActionWrapper = styled.div` - align-self: center; - padding-right: 1rem; -`; - -class Breadcrumb extends React.Component { - renderPath() { - const { revision, path, baseUrl } = this.props; - - if (path) { - const paths = path.split("/"); - const map = paths.map((path, index) => { - const currPath = paths.slice(0, index + 1).join("/"); - if (paths.length - 1 === index) { - return ( -
  • - - {path} - -
  • - ); - } - return ( -
  • - {path} -
  • - ); - }); - return map; - } - return null; - } - - render() { - const { - baseUrl, - branch, - defaultBranch, - branches, - revision, - path, - repository, - t - } = this.props; - - let homeUrl = baseUrl + "/"; - if (revision) { - homeUrl += encodeURIComponent(revision) + "/"; - } - - return ( - <> -
    - -
      -
    • - - - -
    • - {this.renderPath()} -
    -
    - {binder.hasExtension("repos.sources.actionbar") && ( - - b.name.replace("/", "%2F") === revision - ).length > 0 - : true, - repository - }} - renderAll={true} - /> - - )} -
    -
    - - ); - } -} - -export default translate("commons")(Breadcrumb); diff --git a/scm-ui/ui-components/src/Breadcrumb.tsx b/scm-ui/ui-components/src/Breadcrumb.tsx index 8402bc25eb..6e35f537bc 100644 --- a/scm-ui/ui-components/src/Breadcrumb.tsx +++ b/scm-ui/ui-components/src/Breadcrumb.tsx @@ -61,13 +61,18 @@ class Breadcrumb extends React.Component { render() { const { baseUrl, branch, defaultBranch, branches, revision, path, repository, t } = this.props; + let homeUrl = baseUrl + "/"; + if (revision) { + homeUrl += encodeURIComponent(revision) + "/"; + } + return ( <>
    • - +
    • diff --git a/scm-ui/ui-webapp/src/repos/sources/containers/Sources.js b/scm-ui/ui-webapp/src/repos/sources/containers/Sources.js deleted file mode 100644 index 18b65e3f2f..0000000000 --- a/scm-ui/ui-webapp/src/repos/sources/containers/Sources.js +++ /dev/null @@ -1,230 +0,0 @@ -// @flow -import React from "react"; -import {connect} from "react-redux"; -import {withRouter} from "react-router-dom"; -import type {Branch, Repository} from "@scm-manager/ui-types"; -import FileTree from "../components/FileTree"; -import {BranchSelector, Breadcrumb, ErrorNotification, Loading} from "@scm-manager/ui-components"; -import {translate} from "react-i18next"; -import { - fetchBranches, - getBranches, - getFetchBranchesFailure, - isFetchBranchesPending -} from "../../branches/modules/branches"; -import {compose} from "redux"; -import Content from "./Content"; -import {fetchSources, isDirectory} from "../modules/sources"; - -type Props = { - repository: Repository, - loading: boolean, - error: Error, - baseUrl: string, - branches: Branch[], - revision: string, - path: string, - currentFileIsDirectory: boolean, - - // dispatch props - fetchBranches: Repository => void, - fetchSources: (Repository, string, string) => void, - - // Context props - history: any, - match: any, - location: any, - t: string => string -}; - -type State = { - selectedBranch: any -}; - -class Sources extends React.Component { - constructor(props: Props) { - super(props); - - this.state = { - selectedBranch: null - }; - } - - componentDidMount() { - const { - fetchBranches, - repository, - revision, - path, - fetchSources - } = this.props; - - fetchBranches(repository); - fetchSources(repository, revision, path); - - this.redirectToDefaultBranch(); - } - - componentDidUpdate(prevProps) { - const { fetchSources, repository, revision, path } = this.props; - if (prevProps.revision !== revision || prevProps.path !== path) { - fetchSources(repository, revision, path); - } - - this.redirectToDefaultBranch(); - } - - redirectToDefaultBranch = () => { - const { branches } = this.props; - if (this.shouldRedirectToDefaultBranch()) { - const defaultBranches = branches.filter(b => b.defaultBranch); - - if (defaultBranches.length > 0) { - this.branchSelected(defaultBranches[0]); - } - } - }; - - shouldRedirectToDefaultBranch = () => { - const { branches, revision } = this.props; - return branches && !revision; - }; - - branchSelected = (branch?: Branch) => { - const { baseUrl, history, path } = this.props; - let url; - if (branch) { - this.setState({ selectedBranch: branch }); - if (path) { - url = `${baseUrl}/${encodeURIComponent(branch.name)}/${path}`; - } else { - url = `${baseUrl}/${encodeURIComponent(branch.name)}/`; - } - } else { - this.setState({ selectedBranch: null }); - url = `${baseUrl}/`; - } - history.push(url); - }; - - render() { - const { - repository, - baseUrl, - loading, - error, - revision, - path, - currentFileIsDirectory - } = this.props; - - if (error) { - return ; - } - - if (loading) { - return ; - } - - if (currentFileIsDirectory) { - return ( -
      - {this.renderBranchSelector()} - {this.renderBreadcrumb()} - -
      - ); - } else { - return ( - - ); - } - } - - renderBranchSelector = () => { - const { branches, revision, t } = this.props; - - if (branches) { - return ( -
      - { - this.branchSelected(b); - }} - /> -
      - ); - } - return null; - }; - - renderBreadcrumb = () => { - const { revision, path, baseUrl, branches, repository } = this.props; - const { selectedBranch } = this.state; - - //TODO refactor - return ( - b.defaultBranch === true)[0] - } - branches={branches} - repository={repository} - /> - ); - }; -} - -const mapStateToProps = (state, ownProps) => { - const { repository, match } = ownProps; - const { revision, path } = match.params; - const decodedRevision = revision ? decodeURIComponent(revision) : undefined; - const loading = isFetchBranchesPending(state, repository); - const error = getFetchBranchesFailure(state, repository); - const branches = getBranches(state, repository); - const currentFileIsDirectory = decodedRevision - ? isDirectory(state, repository, decodedRevision, path) - : isDirectory(state, repository, revision, path); - - return { - repository, - revision: decodedRevision, - path, - loading, - error, - branches, - currentFileIsDirectory - }; -}; - -const mapDispatchToProps = dispatch => { - return { - fetchBranches: (repository: Repository) => { - dispatch(fetchBranches(repository)); - }, - fetchSources: (repository: Repository, revision: string, path: string) => { - dispatch(fetchSources(repository, revision, path)); - } - }; -}; - -export default compose( - translate("repos"), - withRouter, - connect( - mapStateToProps, - mapDispatchToProps - ) -)(Sources); diff --git a/scm-ui/ui-webapp/src/repos/sources/containers/Sources.tsx b/scm-ui/ui-webapp/src/repos/sources/containers/Sources.tsx index 33626ddcc4..037f93e166 100644 --- a/scm-ui/ui-webapp/src/repos/sources/containers/Sources.tsx +++ b/scm-ui/ui-webapp/src/repos/sources/containers/Sources.tsx @@ -151,20 +151,19 @@ class Sources extends React.Component { const { revision, path, baseUrl, branches, repository } = this.props; const { selectedBranch } = this.state; - if (revision) { - return ( - b.defaultBranch === true)[0]} - branches={branches} - repository={repository} - /> - ); - } - return null; + return ( + b.defaultBranch === true)[0] + } + branches={branches} + repository={repository} + /> + ); }; }