diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml index 08f2b22..478a7b9 100644 --- a/.gitlab-ci.yml +++ b/.gitlab-ci.yml @@ -1,19 +1,45 @@ image: node:latest +stages: + - build + - deploy + cache: paths: - node_modules/ - + before_script: - apt-get update -y && apt-get upgrade -y - - apt-get install rsync -y - - mkdir -p ~/.ssh - - echo -e "$SSH_PRIVATE_KEY" > ~/.ssh/id_rsa - - chmod 600 ~/.ssh/id_rsa - - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config' - -test_execution: + +build: + stage: build script: - npm install - npm run build - - rsync -rvz build ryuuji@142.93.158.54:~ \ No newline at end of file + artifacts: + paths: + - build/ + +deploy: + stage: deploy + script: + ## Install ssh-agent if not already installed + - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client git -y )' + + ## Run ssh-agent (inside the build environment) + - eval $(ssh-agent -s) + + ## Add the SSH key stored in SSH_PRIVATE_KEY variable to the agent store + - echo "$SSH_PRIVATE_KEY" | tr -d '\r' | ssh-add - + + ## Create the SSH directory and give it the right permissions + - mkdir -p ~/.ssh + - chmod 700 ~/.ssh + + ## Use ssh-keyscan to scan the keys of the private server + - ssh-keyscan "$REMOTE_HOST" >> ~/.ssh/known_hosts + - chmod 644 ~/.ssh/known_hosts + + ## Sync the project to the deploy route + - apt-get install rsync -y + - rsync -rvz build "$DEPLOY_ROUTE" diff --git a/src/app.jsx b/src/app.jsx index 2b7eafa..c6cade3 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -1,34 +1,4 @@ -import React from "react"; +import React, {Fragment} from "react"; import SearchBar from "./components/SearchBar"; -export class Nav extends React.Component { - render() { - return ( - - ) - } -} -export function Main() { - return ( -
-
- ) -} - -export function NoRoute() { - return ( -
-

Esa pagina no existe

-
- ) -} diff --git a/src/components/Nav.jsx b/src/components/Nav.jsx new file mode 100644 index 0000000..e48278b --- /dev/null +++ b/src/components/Nav.jsx @@ -0,0 +1,15 @@ +import React from "react"; + +export class Nav extends React.Component { + render() { + return ( + + ) + } +} diff --git a/src/components/Paginate.jsx b/src/components/Paginate.jsx index 556ea17..980576d 100644 --- a/src/components/Paginate.jsx +++ b/src/components/Paginate.jsx @@ -92,7 +92,6 @@ export class Paginate extends Component { const totalBlocks = totalNumbers + 2; if (totalPages > totalBlocks) { - const startPage = Math.max(2, currentPage - pageNeighbours); const endPage = Math.min(totalPages - 1, currentPage + pageNeighbours); @@ -107,27 +106,17 @@ export class Paginate extends Component { const hasRightSpill = (totalPages - endPage) > 1; const spillOffset = totalNumbers - (pages.length + 1); - switch (true) { - // handle: (1) < {5 6} [7] {8 9} (10) - case (hasLeftSpill && !hasRightSpill): { - const extraPages = range(startPage - spillOffset, startPage - 1); - pages = [LEFT_PAGE, ...extraPages, ...pages]; - break; - } - + // handle: (1) < {5 6} [7] {8 9} (10) + if (hasLeftSpill && !hasRightSpill) { + const extraPages = range(startPage - spillOffset, startPage - 1); + pages = [LEFT_PAGE, ...extraPages, ...pages]; // handle: (1) {2 3} [4] {5 6} > (10) - case (!hasLeftSpill && hasRightSpill): { - const extraPages = range(endPage + 1, endPage + spillOffset); - pages = [...pages, ...extraPages, RIGHT_PAGE]; - break; - } - + } else if (!hasLeftSpill && hasRightSpill) { + const extraPages = range(endPage + 1, endPage + spillOffset); + pages = [...pages, ...extraPages, RIGHT_PAGE]; // handle: (1) < {4 5} [6] {7 8} > (10) - case (hasLeftSpill && hasRightSpill): - default: { - pages = [LEFT_PAGE, ...pages, RIGHT_PAGE]; - break; - } + } else if (hasLeftSpill && hasRightSpill) { + pages = [LEFT_PAGE, ...pages, RIGHT_PAGE]; } return [1, ...pages, totalPages]; @@ -143,32 +132,35 @@ export class Paginate extends Component { const currentPage = this.state.currentPage; const pages = this.fetchPageNumbers(); + const blocks = pages.map((page, index) => { + if (page === LEFT_PAGE) return ( +
  • + + « Anterior + +
  • + ); + if (page === RIGHT_PAGE) return ( +
  • + + Siguiente » + +
  • + ); + return ( +
  • + {page} +
  • + ); + }) return ( ); diff --git a/src/components/Search.jsx b/src/components/Search.jsx index e26a923..bf1d040 100644 --- a/src/components/Search.jsx +++ b/src/components/Search.jsx @@ -9,10 +9,6 @@ import {Paginate} from "./Paginate"; class SearchList extends React.Component { constructor(props) { super(props); - this.buildList(this.props.artists); - } - - buildList(artists) { } render() { diff --git a/src/index.jsx b/src/index.jsx index f3b8dab..a98a8cd 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,18 +1,36 @@ -import React from 'react'; +import React, {Fragment} from 'react'; import ReactDOM from 'react-dom'; -import {Main, NoRoute} from "./app"; import {Search} from './components/Search'; import {Router} from "@reach/router"; +import SearchBar from "./components/SearchBar"; import './styles/reset.css'; import './styles/main.css'; +import {Nav} from "./components/Nav"; + +const Main = () => ( + +