Initial commit

.editorconfig

+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[*.{jade,pug}]
+trim_trailing_whitespace = false
+
+[*.styl]
+indent_size = 4

.eslintrc.json

+{
+  "extends": ["cozy-app/react"]
+}

.gitignore

+# NPM
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# Build
+build/
+
+# Coverage
+coverage/
+
+# transifex
+.transifexrc
+
+# Coverage
+coverage/
+
+# OS generated files
+.DS_Store
+.DS_Store?
+._*
+.Spotlight-V100
+.Trashes
+ehthumbs.db
+Thumbs.db
+desktop.ini
+
+# Mobile
+targets/mobile/hooks
+targets/mobile/platforms
+targets/mobile/plugins
+targets/mobile/www
+targets/mobile/keys
+targets/mobile/res/icons
+targets/mobile/res/screens
+targets/mobile/icon.png
+targets/mobile/store
+
+# fastlane
+mobile/fastlane/README.md
+mobile/fastlane/report.xml
+mobile/fastlane/Error*.png
+mobile/fastlane/Preview.html
+mobile/Preview.html
+
+# Default
+# /!\ KEEP THIS SECTION THE LAST ONE
+!.gitkeep

.stylintrc

+{
+  "blocks": "never",
+  "brackets": {
+    "expect": "never",
+    "error": true
+  },
+  "colons": {
+    "expect": "never",
+    "error": true
+  },
+  "colors": {
+    "expect": "always",
+    "error": true
+  },
+  "commaSpace": {
+    "expect": "always",
+    "error": true
+  },
+  "commentSpace": {
+    "expect": "always",
+    "error": true
+  },
+  "cssLiteral": "never",
+  "customProperties": [],
+  "depthLimit": 4,
+  "duplicates": {
+    "expect": true,
+    "error": true
+  },
+  "efficient": {
+    "expect": "always",
+    "error": true
+  },
+  "exclude": [],
+  "extendPref": "@extend",
+  "globalDupe": {
+    "expect": true,
+    "error": true
+  },
+  "groupOutputByFile": {
+    "expect": true,
+    "error": true
+  },
+  "indentPref": {
+    "expect": 4,
+    "error": true
+  },
+  "leadingZero": {
+    "expect": "never",
+    "error": true
+  },
+  "maxErrors": false,
+  "maxWarnings": false,
+  "mixed": {
+    "expect": true,
+    "error": true
+  },
+  "mixins": ["top-padded","right-padded","bottom-padded","left-padded","vertically-padded","horizontally-padded","padded","top-spaced","right-spaced","bottom-spaced","left-spaced","vertically-spaced","horizontally-spaced","spaced","hide","reset"],
+  "namingConvention": {
+    "expect": "lowercase-dash",
+    "error": true
+  },
+  "namingConventionStrict": false,
+  "none": {
+    "expect": "never",
+    "error": true
+  },
+  "noImportant": {
+    "expect": true,
+    "error": true
+  },
+  "parenSpace": {
+    "expect": "never",
+    "error": true
+  },
+  "placeholders": {
+    "expect": "always",
+    "error": true
+  },
+  "prefixVarsWithDollar": false,
+  "quotePref": {
+    "expect": "single",
+    "error": true
+  },
+  "reporterOptions": {
+      "columns": ["lineData", "severity", "description", "rule"],
+      "columnSplitter": "  ",
+      "showHeaders": false,
+      "truncate": true
+  },
+  "semicolons": {
+    "expect": "never",
+    "error": true
+  },
+  "sortOrder": false,
+  "stackedProperties": {
+    "expect": "never",
+    "error": true
+  },
+  "trailingWhitespace": {
+    "expect": "never",
+    "error": true
+  },
+  "universal": {
+    "expect": "never",
+    "error": true
+  },
+  "valid": {
+    "expect": true,
+    "error": true
+  },
+  "zeroUnits": {
+    "expect": "never",
+    "error": true
+  },
+  "zIndexNormalize": {
+    "expect": 1,
+    "error": true
+  }
+}

.travis.yml

+language: node_js
+node_js:
+- '10'
+branches:
+  only:
+  - master
+env:
+  global:
+  # GITHUB_TOKEN for yarn deploy script
+  # to generate yours : travis encrypt GITHUB_TOKEN=<your_GITHUB_TOKEN> -r bastiendmt/lets-gone 
+  # REGISTRY_TOKEN for yarn cozyPublish script
+  # to generate yours : travis encrypt REGISTRY_TOKEN=<your_REGISTRY_TOKEN> -r bastiendmt/lets-gone
+  # N.B.: the --org option is needed only for public repositories
+cache:
+  yarn: true
+  directories:
+  - node_modules
+stages:
+  - prebuild
+  - build
+jobs:
+  include:
+    - name: 'Lint'
+      stage: 'prebuild'
+      script: yarn lint
+    - name: 'Tests'
+      stage: 'prebuild'
+      script: yarn test
+    - name: 'Build app'
+      stage: 'build'
+      script: yarn build
+      deploy:
+        - provider: script
+          repo: bastiendmt/lets-gone
+          skip-cleanup: true
+          # deploy the build on a build branch and publish to the Cozy registry
+          script: DEPLOY_BRANCH=build && yarn deploy && yarn cozyPublish
+          on:
+            branch: master
+        - provider: script
+          repo: bastiendmt/lets-gone
+          skip-cleanup: true
+          # publish stable or beta versions using Github Releases (git tag)
+          script: DEPLOY_BRANCH=build && yarn cozyPublish
+          on:
+            tags: true

CONTRIBUTING.md

+# How to contribute to Lets gone?
+
+Thank you for your interest in contributing to this Cozy application! There are many ways to contribute, and we appreciate all of them.
+
+
+## Security Issues
+
+If you discover a security issue, please bring it to our attention right away! Please **DO NOT** file a public issue, instead send your report privately to security AT cozycloud DOT cc.
+
+Security reports are greatly appreciated and we will publicly thank you for it. We currently do not offer a paid security bounty program, but are not ruling it out in the future.
+
+
+## Bug Reports
+
+While bugs are unfortunate, they're a reality in software. We can't fix what we don't know about, so please report liberally. If you're not sure if something is a bug or not, feel free to file a bug anyway.
+
+Opening an issue is as easy as following [this link][issues] and filling out the fields. Here are some things you can write about your bug:
+
+- A short summary
+- What did you try, step by step?
+- What did you expect?
+- What did happen instead?
+- What is the version of the Lets gone app?
+
+
+## Pull Requests
+
+Please keep in mind that:
+
+- Pull-Requests point to the `master` branch
+- You need to cover your code and feature by tests
+- You may add documentation in the `/docs` directory to explain your choices if needed
+- We recommend to use [task lists][checkbox] to explain steps / features in your Pull-Request description
+- you do _not_ need to build app to submit a PR
+- you should update the Transifex source locale file if you modify it for your feature needs (see [Localization section in README][localization])
+
+
+### Workflow
+
+Pull requests are the primary mechanism we use to change Cozy. GitHub itself has some [great documentation][pr] on using the Pull Request feature. We use the _fork and pull_ model described there.
+
+#### Step 1: Fork
+
+Fork the project on GitHub and [check out your copy locally][forking].
+
+```
+$ git clone github.com/bastiendmt/lets-gone.git
+$ cd lets-gone
+$ git remote add fork git://github.com/yourusername/lets-gone.git
+```
+
+#### Step 2: Branch
+
+Create a branch and start hacking:
+
+```
+$ git checkout -b my-branch origin/master
+```
+
+#### Step 3: Code
+
+Well, we think you know how to do that. Just be sure to follow the coding guidelines from the community ([standard JS][stdjs], comment the code, etc).
+
+#### Step 4: Test
+
+Don't forget to add tests and be sure they are green:
+
+```
+$ cd lets-gone
+$ npm run test
+```
+
+#### Step 5: Commit
+
+Writing [good commit messages][commitmsg] is important. A commit message should describe what changed and why.
+
+#### Step 6: Rebase
+
+Use `git rebase` (_not_ `git merge`) to sync your work from time to time.
+
+```
+$ git fetch origin
+$ git rebase origin/master my-branch
+```
+
+#### Step 7: Push
+
+```
+$ git push -u fork my-branch
+```
+
+Go to https://github.com/yourusername/lets-gone and select your branch. Click the 'Pull Request' button and fill out the form.
+
+Alternatively, you can use [hub] to open the pull request from your terminal:
+
+```
+$ git pull-request -b master -m "My PR message" -o
+```
+
+Pull requests are usually reviewed within a few days. If there are comments to address, apply your changes in a separate commit and push that to your branch. Post a comment in the pull request afterwards; GitHub doesn't send out notifications when you add commits.
+
+
+## Writing documentation
+
+Documentation improvements are very welcome. We try to keep a good documentation in the `/docs` folder. But, you know, we are developers, we can forget to document important stuff that look obvious to us. And documentation can always be improved.
+
+
+## Translations
+
+The Lets gone is translated on a platform called [Transifex][tx]. [This tutorial][tx-start] can help you to learn how to make your first steps here. If you have any question, don't hesitate to ask us!
+
+
+## Community
+
+You can help us by making our community even more vibrant. For example, you can write a blog post, take some videos, answer the questions on [the forum][forum], organize new meetups, and speak about what you like in Cozy!
+
+
+
+[issues]: https://github.com/bastiendmt/lets-gone/issues/new
+[pr]: https://help.github.com/categories/collaborating-with-issues-and-pull-requests/
+[forking]: http://blog.campoy.cat/2014/03/github-and-go-forking-pull-requests-and.html
+[stdjs]: http://standardjs.com/
+[commitmsg]: http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html
+[localization]: https://github.com/bastiendmt/lets-gone/blob/master/README.md#localization
+[hub]: https://hub.github.com/
+[tx]: https://www.transifex.com/cozy/
+[tx-start]: http://docs.transifex.com/getting-started/translators/
+[forum]: https://forum.cozy.io/

README.md

+[![Travis build status shield](https://img.shields.io/travis/bastiendmt/lets-gone/master.svg)](https://travis-ci.org/bastiendmt/lets-gone)
+[![Github Release version shield](https://img.shields.io/github/tag/bastiendmt/lets-gone.svg)](https://github.com/bastiendmt/lets-gone/releases)
+[![jest](https://facebook.github.io/jest/img/jest-badge.svg)](https://github.com/facebook/jest)
+
+
+# Lets gone
+
+## What's Lets gone?
+
+<TODO>...
+
+
+## Hack
+
+_:pushpin: Note:_ we recommend to use [Yarn] instead of NPM for package management. Don't hesitate to [install][yarn-install] and use it for your Cozy projects, it's now our main node packages tool for Cozy official apps.
+
+### Install
+
+Hacking the Cozy Lets gone app requires you to [setup a dev environment][setup].
+
+You can then clone the app repository and install dependencies:
+
+```sh
+$ git clone https://github.com/bastiendmt/lets-gone.git
+$ cd lets-gone
+$ yarn install
+```
+
+:pushpin: If you use a node environment wrapper like [nvm] or [ndenv], don't forget to set your local node version before doing a `yarn install`.
+
+Cozy's apps use a standard set of _npm scripts_ to run common tasks, like watch, lint, test, build…
+
+
+### Run it inside a Cozy using Docker
+
+You can run your application inside a Cozy thanks to the [cozy-stack docker image][cozy-stack-docker]:
+
+```sh
+# in a terminal, run your app in watch mode with a docker running Cozy
+$ cd lets-gone
+$ yarn start
+```
+
+```sh
+# in an other terminal, run the docker image 
+$ cd lets-gone
+$ yarn stack:docker:dev
+``` 
+
+After the build and the docker image launched, your app is now available at http://lets-gone.cozy.tools:8080.
+
+Note: By default, HMR (Hot Module Replacement) is enabled on your front application. To have it working, we have disabled our CSP (Content Security Policy) when running `yarn stack:docker:dev`. This is not the configuration we'll have in a production environnement. To test our app in real conditions, build your application by running `yarn build` and launch the docker image with the `yarn stack:docker:prod` command.
+
+### Living on the edge
+
+[Cozy-ui] is our frontend stack library that provides common styles and components accross the whole Cozy's apps. You can use it for you own application to follow the official Cozy's guidelines and styles. If you need to develop / hack cozy-ui, it's sometimes more useful to develop on it through another app. You can do it by cloning cozy-ui locally and link it to yarn local index:
+
+```sh
+git clone https://github.com/cozy/cozy-ui.git
+cd cozy-ui
+yarn install
+yarn link
+```
+
+then go back to your app project and replace the distributed cozy-ui module with the linked one:
+
+```sh
+cd cozy-drive
+yarn link cozy-ui
+```
+
+[Cozy-client-js] is our API library that provides an unified API on top of the cozy-stack. If you need to develop / hack cozy-client-js in parallel of your application, you can use the same trick that we used with [cozy-ui]: yarn linking.
+
+
+### Tests
+
+Tests are run by [jest] under the hood. You can easily run the tests suite with:
+
+```sh
+$ cd lets-gone
+$ yarn test
+```
+
+:pushpin: Don't forget to update / create new tests when you contribute to code to keep the app the consistent.
+
+
+## Models
+
+The Cozy datastore stores documents, which can be seen as JSON objects. A `doctype` is simply a declaration of the fields in a given JSON object, to store similar objects in an homogeneous fashion.
+
+Cozy ships a [built-in list of `doctypes`][doctypes] for representation of most of the common documents (Bills, Contacts, Files, ...).
+
+Whenever your app needs to use a given `doctype`, you should:
+
+- Check if this is a standard `doctype` defined in Cozy itself. If this is the case, you should add a model declaration in your app containing at least the fields listed in the [main fields list for this `doctype`][doctypes]. Note that you can extend the Cozy-provided `doctype` with your own customs fields. This is typically what is done in [Konnectors] for the [Bill `doctype`][bill-doctype].
+- If no standards `doctypes` fit your needs, you should define your own `doctype` in your app. In this case, you do not have to put any field you want in your model, but you should crosscheck other cozy apps to try to homogeneize the names of your fields, so that your `doctype` data could be reused by other apps. This is typically the case for the [Konnector `doctype`][konnector-doctype] in [Konnectors].
+
+
+### Open a Pull-Request
+
+If you want to work on Lets gone and submit code modifications, feel free to open pull-requests! See the [contributing guide][contribute] for more information about how to properly open pull-requests.
+
+
+## Community
+
+### What's Cozy?
+
+<div align="center">
+  <a href="https://cozy.io">
+    <img src="https://cdn.rawgit.com/cozy/cozy-site/master/src/images/cozy-logo-name-horizontal-blue.svg" alt="cozy" height="48" />
+  </a>
+ </div>
+ </br>
+
+[Cozy] is a platform that brings all your web services in the same private space.  With it, your webapps and your devices can share data easily, providing you with a new experience. You can install Cozy on your own hardware where no one's tracking you.
+
+### Localization
+
+Localization and translations are handled by [Transifex][tx], which is used by all Cozy's apps.
+
+As a _translator_, you can login to [Transifex][tx-signin] (using your Github account) and claim an access to the [app repository][tx-app]. Transifex will then create pull request on the repository, and the locales are merged after validating the pull request.
+
+As a _developer_, you have to modify json in `/src/locales`. New locales will be automatically added to Transifex. If you need to pull or push manually locales, you can use [Transifex CLI](tx-cli). If you were using a [transifex-client](tx-client), you must move to [Transifex CLI](tx-cli) to be compatible with the v3 API.
+
+### Maintainer
+
+The lead maintainer for Lets gone is [bastiendmt](https://github.com/bastiendmt), send him/her a :beers: to say hello!
+
+
+### Get in touch
+
+You can reach the Cozy Community by:
+
+- Chatting with us on IRC `#cozycloud` on [Libera.Chat][libera]
+- Posting on our [Forum][forum]
+- Posting issues on the [Github repos][github]
+- Say Hi! on [Twitter][twitter]
+
+
+## License
+
+Lets gone is developed by bastiendmt and distributed under the [AGPL v3 license][agpl-3.0].
+
+
+
+[cozy]: https://cozy.io "Cozy Cloud"
+[setup]: https://dev.cozy.io/#set-up-the-development-environment "Cozy dev docs: Set up the Development Environment"
+[yarn]: https://yarnpkg.com/
+[yarn-install]: https://yarnpkg.com/en/docs/install
+[cozy-ui]: https://github.com/cozy/cozy-ui
+[cozy-client-js]: https://github.com/cozy/cozy-client-js/
+[cozy-stack-docker]: https://github.com/cozy/cozy-stack/blob/master/docs/client-app-dev.md#with-docker
+[doctypes]: https://cozy.github.io/cozy-doctypes/
+[bill-doctype]: https://github.com/cozy/cozy-konnector-libs/blob/master/models/bill.js
+[konnector-doctype]: https://github.com/cozy/cozy-konnector-libs/blob/master/models/base_model.js
+[konnectors]: https://github.com/cozy/cozy-konnector-libs
+[agpl-3.0]: https://www.gnu.org/licenses/agpl-3.0.html
+[contribute]: CONTRIBUTING.md
+[tx]: https://www.transifex.com/cozy/
+[tx-signin]: https://www.transifex.com/signin/
+[tx-app]: https://www.transifex.com/cozy/<SLUG_TX>/dashboard/
+[tx-cli]: https://developers.transifex.com/docs/cli
+[tx-client]: https://github.com/transifex/transifex-client
+[libera]: https://web.libera.chat/#cozycloud
+[forum]: https://forum.cozy.io/
+[github]: https://github.com/cozy/
+[twitter]: https://twitter.com/cozycloud
+[nvm]: https://github.com/creationix/nvm
+[ndenv]: https://github.com/riywo/ndenv
+[jest]: https://facebook.github.io/jest/

babel.config.js

+module.exports = {
+  presets: ['cozy-app']
+}

jest.config.js

+module.exports = {
+  testURL: 'http://localhost/',
+  moduleFileExtensions: ['js', 'jsx', 'json', 'styl'],
+  setupFiles: ['<rootDir>/test/jestLib/setup.js'],
+  moduleDirectories: ['src', 'node_modules'],
+  moduleNameMapper: {
+    '\\.(png|gif|jpe?g|svg)$': '<rootDir>/test/__mocks__/fileMock.js',
+    // identity-obj-proxy module is installed by cozy-scripts
+    '.styl$': 'identity-obj-proxy',
+    '^cozy-client$': 'cozy-client/dist/index',
+    '^src/(.*)': '<rootDir>/src/$1',
+    '^test/(.*)': '<rootDir>/test/$1'
+  },
+  transformIgnorePatterns: ['node_modules/(?!cozy-ui)'],
+  globals: {
+    __ALLOW_HTTP__: false,
+    __TARGET__: 'browser',
+    cozy: {}
+  }
+}

jsconfig.json

+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "src/*": ["./src/*"],
+      "test/*": ["./test/*"]
+    }
+  },
+  "exclude": ["node_modules", "build"]
+}

manifest.webapp

+{
+  "name": "Lets gone",
+  "slug": "lets-gone",
+  "icon": "icon.svg",
+  "categories": [],
+  "version": "0.1.0",
+  "licence": "AGPL-3.0",
+  "editor": "",
+  "source": "https://github.com/bastiendmt/lets-gone.git@build",
+  "developer": {
+    "name": "bastiendmt",
+    "url": ""
+  },
+  "routes": {
+    "/": {
+      "folder": "/",
+      "index": "index.html",
+      "public": false
+    }
+  },
+  "permissions": {
+    "apps": {
+      "description": "Required by the cozy-bar to display the icons of the apps",
+      "type": "io.cozy.apps",
+      "verbs": ["GET"]
+    },
+    "settings": {
+      "description": "Required by the cozy-bar to display Claudy and know which applications are coming soon",
+      "type": "io.cozy.settings",
+      "verbs": ["GET"]
+    },
+    "mocks todos": {
+      "description": "TO REMOVE: only used as demonstration about Cozy App data interactions",
+      "type": "io.mocks.todos"
+    }
+  }
+}

package.json

+{
+  "name": "lets-gone",
+  "version": "0.1.0",
+  "scripts": {
+    "lint": "yarn lint:js && yarn lint:styles",
+    "lint:js": "cs lint '{src,test}/**/*.{js,jsx}'",
+    "lint:styles": "stylint src/styles --config ./.stylintrc",
+    "prebuild": "yarn lint",
+    "build": "yarn build:browser",
+    "build:browser": "cs build --browser",
+    "build:mobile": "cs build --mobile",
+    "watch": "yarn watch:browser",
+    "watch:browser": "cs watch --browser",
+    "watch:mobile": "cs watch --mobile",
+    "start": "cs start --browser",
+    "deploy": "git-directory-deploy --directory build/ --branch ${DEPLOY_BRANCH:-build} --repo=${DEPLOY_REPOSITORY:-https://$GITHUB_TOKEN@github.com/bastiendmt/lets-gone.git}",
+    "test": "cs test --verbose --coverage",
+    "cozyPublish": "git fetch origin ${DEPLOY_BRANCH:-build}:${DEPLOY_BRANCH:-build} && cs publish --token $REGISTRY_TOKEN --build-commit $(git rev-parse ${DEPLOY_BRANCH:-build})",
+    "stack:docker:dev": "cs stackDocker",
+    "stack:docker:prod": "cs stackDocker --prod"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/bastiendmt/lets-gone.git"
+  },
+  "author": "",
+  "contributors": [],
+  "license": "AGPL-3.0",
+  "bugs": {
+    "url": "https://github.com/bastiendmt/lets-gone/issues"
+  },
+  "homepage": "https://github.com/bastiendmt/lets-gone#readme",
+  "devDependencies": {
+    "@testing-library/jest-dom": "5.16.5",
+    "@testing-library/react": "13.4.0",
+    "babel-preset-cozy-app": "^2.0.4",
+    "cozy-bar": "7.16.0",
+    "eslint-config-cozy-app": "^5.2.0",
+    "git-directory-deploy": "1.5.1",
+    "react-hot-loader": "4.13.0",
+    "react-test-renderer": "18.2.0"
+  },
+  "dependencies": {
+    "cozy-client": "^34.5.0",
+    "cozy-device-helper": "^2.6.0",
+    "cozy-flags": "^2.10.2",
+    "cozy-intent": "^2.7.0",
+    "cozy-logger": "^1.9.1",
+    "cozy-scripts": "8.3.0",
+    "cozy-ui": "^78.1.1",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-router-dom": "6.4.5"
+  }
+}
\ No newline at end of file

renovate.json

+{
+  "extends": [
+    "cozy"
+  ]
+}

src/assets/icons/icon-bullet-point.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+  <path d="M14,5c0,-1.656 -1.344,-3 -3,-3l-6,0c-1.656,0 -3,1.344 -3,3l0,6c0,1.656 1.344,3 3,3l6,0c1.656,0 3,-1.344 3,-3l0,-6Z"/>
+</svg>

src/components/AppLayout.jsx

+/* global cozy */
+import React from 'react'
+import { Outlet } from 'react-router-dom'
+import cx from 'classnames'
+
+import { Layout, Main, Content } from 'cozy-ui/transpiled/react/Layout'
+import Sprite from 'cozy-ui/transpiled/react/Icon/Sprite'
+import Alerter from 'cozy-ui/transpiled/react/Alerter'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import useBreakpoints from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
+import MuiCozyTheme from 'cozy-ui/transpiled/react/MuiCozyTheme'
+import BarTitle from 'cozy-ui/transpiled/react/BarTitle'
+import { useClient } from 'cozy-client'
+
+import Sidebar from 'src/components/Sidebar'
+
+const AppLayout = () => {
+  const { t } = useI18n()
+  const client = useClient()
+  const { isMobile } = useBreakpoints()
+  const { BarCenter } = cozy.bar
+
+  return (
+    <Layout>
+      {isMobile && (
+        <BarCenter>
+          <MuiCozyTheme>
+            <BarTitle>{client.appMetadata.slug}</BarTitle>
+          </MuiCozyTheme>
+        </BarCenter>
+      )}
+      <Sidebar />
+      <Main>
+        <Content
+          className={cx({
+            'u-mh-half u-mv-1': isMobile,
+            'u-mh-2 u-mv-1': !isMobile
+          })}
+        >
+          <Outlet />
+        </Content>
+      </Main>
+      <Alerter t={t} />
+      <Sprite />
+    </Layout>
+  )
+}
+
+export default AppLayout

src/components/AppRouter.jsx

+import React from 'react'
+import {
+  Route,
+  Navigate,
+  RouterProvider,
+  createHashRouter,
+  createRoutesFromElements
+} from 'react-router-dom'
+
+import TodoWrapper from 'src/components/Todos/TodoWrapper'
+import Hello1 from 'src/components/HelloViews/Hello1'
+import Hello2 from 'src/components/HelloViews/Hello2'
+import AppLayout from 'src/components/AppLayout'
+
+const AppRouter = () => {
+  const routes = (
+    <Route path="/" element={<AppLayout />}>
+      <Route path="todos" element={<TodoWrapper />} />
+      <Route path="viewhello1" element={<Hello1 />} />
+      <Route path="viewhello2" element={<Hello2 />} />
+      <Route path="*" element={<Navigate to="/todos" replace />} />
+    </Route>
+  )
+  const router = createHashRouter(createRoutesFromElements(routes))
+
+  return <RouterProvider router={router} />
+}
+
+export default AppRouter

src/components/HelloViews/Hello1.jsx

+import React from 'react'
+
+export const Hello1 = () => (
+  <p>Just... Hello world! This is a first hello view</p>
+)
+
+export default Hello1

src/components/HelloViews/Hello1.spec.jsx

+'use strict'
+import React from 'react'
+import { render } from '@testing-library/react'
+
+import { Hello1 } from 'src/components/HelloViews/Hello1'
+import AppLike from 'test/AppLike'
+
+const setup = () => {
+  return render(
+    <AppLike>
+      <Hello1 />
+    </AppLike>
+  )
+}
+
+describe('Hello1 component:', () => {
+  it('Hello1 should be rendered correctly', () => {
+    const { container, getByText } = setup()
+    expect(container).toBeDefined()
+    expect(getByText('Just... Hello world! This is a first hello view'))
+  })
+})