diff --git a/.github/workflows/website.yml b/.github/workflows/website.yml index ce1e7f25..527e808d 100644 --- a/.github/workflows/website.yml +++ b/.github/workflows/website.yml @@ -1,79 +1,37 @@ ---- -# https://v2.docusaurus.io/docs/deployment#triggering-deployment-with-github-actions -name: Website +name: Deploy to GitHub Pages on: push: branches: [master] - pull_request: - branches: [master] - + paths: [website/**] jobs: - checks: - if: github.event_name != 'push' - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v1 - - name: Get yarn cache directory path - id: yarn-cache-dir-path - run: echo "::set-output name=dir::$(yarn cache dir)" - - uses: actions/cache@v2 - # check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) - id: yarn-cache - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('website/yarn.lock') }} - restore-keys: ${{ runner.os }}-yarn- - - uses: actions/setup-node@v1 - with: - node-version: '12.x' - run: | - cd website - yarn install - yarn build - # npm ci - # npm run build - gh-release: - if: github.event_name != 'pull_request' + deploy: + name: Deploy to GitHub Pages runs-on: ubuntu-latest steps: - - uses: actions/checkout@v1 - - name: Get yarn cache directory path - id: yarn-cache-dir-path - run: echo "::set-output name=dir::$(yarn cache dir)" - - uses: actions/cache@v2 - id: yarn-cache - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('website/yarn.lock') }} - restore-keys: ${{ runner.os }}-yarn- - - uses: actions/setup-node@v1 + - uses: actions/checkout@v2 + - uses: actions/setup-node@v2 with: - node-version: '12.x' - - name: Add key to allow access to repository - env: - SSH_AUTH_SOCK: /tmp/ssh_agent.sock - run: | - mkdir -p ~/.ssh - ssh-keyscan github.com >> ~/.ssh/known_hosts - echo "${{ secrets.GH_PAGES_DEPLOY }}" > ~/.ssh/id_rsa - chmod 600 ~/.ssh/id_rsa - cat <> ~/.ssh/config - Host github.com - HostName github.com - IdentityFile ~/.ssh/id_rsa - EOT - - name: Release to GitHub Pages - env: - USE_SSH: true - GIT_USER: git - PUBLISH: github_samsung_public + node-version: 14.x + cache: yarn + - name: Build website + working-directory: website run: | - git config --global user.email "actions@gihub.com" - git config --global user.name "gh-actions" - cd website - yarn install - yarn deploy - # npm ci - # npx docusaurus deploy + yarn install --frozen-lockfile + yarn build + + # Popular action to deploy to GitHub Pages: + # Docs: https://github.com/peaceiris/actions-gh-pages#%EF%B8%8F-docusaurus + - name: Deploy to GitHub Pages + uses: peaceiris/actions-gh-pages@v3 + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + # Build output to publish to the `gh-pages` branch: + publish_dir: ./website/build + # Assign commit authorship to the official GH-Actions bot for deploys to `gh-pages` branch: + # https://github.com/actions/checkout/issues/13#issuecomment-724415212 + # The GH actions bot is used by default if you didn't specify the two fields. + # You can swap them out with your own user credentials. + user_name: github-actions[bot] + user_email: 41898282+github-actions[bot]@users.noreply.github.com \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index b8635673..626b12bc 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -123,6 +123,9 @@ services: cache_from: ["arthurflam/qaboard:website"] context: website shm_size: 4gb + # by default we assume you run the QA-Board on localhost, but will want to change this + args: + - QABOARD_URL=${QABOARD_URL:-http://localhost:5151} volumes: - website_builds:/builds diff --git a/website/.gitignore b/website/.gitignore index ed12f42d..b2d6de30 100644 --- a/website/.gitignore +++ b/website/.gitignore @@ -1 +1,20 @@ -search-data.js +# Dependencies +/node_modules + +# Production +/build + +# Generated files +.docusaurus +.cache-loader + +# Misc +.DS_Store +.env.local +.env.development.local +.env.test.local +.env.production.local + +npm-debug.log* +yarn-debug.log* +yarn-error.log* diff --git a/website/Dockerfile b/website/Dockerfile index 76beeff8..1768b4d4 100644 --- a/website/Dockerfile +++ b/website/Dockerfile @@ -1,4 +1,4 @@ -FROM node:lts +FROM node:lts-alpine WORKDIR /website RUN apk update && apk add --no-cache \ @@ -11,7 +11,7 @@ RUN apk update && apk add --no-cache \ && rm -rf /var/cache/apk/* ENV PATH /app/node_modules/.bin:$PATH -RUN yarn config set strict-ssl false +# RUN yarn config set strict-ssl false # RUN npm install -g yarn @@ -23,7 +23,10 @@ COPY . ./ # On the website we have algolia for the search, but the baseURL (/qaboard) is different than # when running from the application (/docs). So we don't use algolia for the app... -RUN yarn run swizzle docusaurus-lunr-search SearchBar +# RUN yarn run swizzle docusaurus-lunr-search SearchBar +ENV QABOARD_DOCS_FOR_WEBAPP true +ARG QABOARD_URL +ENV QABOARD_URL=$QABOARD_URL RUN yarn build # When upgrading, we want to enable clients to continue using a previous bundle diff --git a/website/README.md b/website/README.md old mode 100755 new mode 100644 index 7eba3506..aaba2fa1 --- a/website/README.md +++ b/website/README.md @@ -1,6 +1,6 @@ # Website -This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator. +This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator. ### Installation @@ -14,7 +14,7 @@ $ yarn $ yarn start ``` -This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server. +This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server. ### Build @@ -26,16 +26,16 @@ This command generates static content into the `build` directory and can be serv ### Deployment +Using SSH: + ``` -$ GIT_USER= USE_SSH=true yarn deploy +$ USE_SSH=true yarn deploy ``` -If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch. - -### Continuous Integration - -Some common defaults for linting/formatting have been set for you. If you integrate your project with an open source Continuous Integration system (e.g. Travis CI, CircleCI), you may check for issues using the following command. +Not using SSH: ``` -$ yarn ci -``` \ No newline at end of file +$ GIT_USER= yarn deploy +``` + +If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch. diff --git a/website/babel.config.js b/website/babel.config.js new file mode 100644 index 00000000..e00595da --- /dev/null +++ b/website/babel.config.js @@ -0,0 +1,3 @@ +module.exports = { + presets: [require.resolve('@docusaurus/core/lib/babel/preset')], +}; diff --git a/website/blog/2020-06-24-flame-graphs.md b/website/blog/2020-06-24-flame-graphs.md index f9ccd806..cddcd2d6 100644 --- a/website/blog/2020-06-24-flame-graphs.md +++ b/website/blog/2020-06-24-flame-graphs.md @@ -1,11 +1,9 @@ --- title: Creating and viewing flame graphs with QA-Board -author: Arthur Flam -author_url: https://shapescience.xyz/ -author_title: Algo engineering at Samsung -author_image_url: https://media-exp1.licdn.com/dms/image/C4D03AQFO_tBlzPZ4ug/profile-displayphoto-shrink_400_400/0?e=1602720000&v=beta&t=35CS2a0jRg32mhVbwpqbddP8HJsFp75hLeQJjAHQHCw tags: [performance, engineering, visualization] image: https://samsung.github.io/qaboard/img/slides/flame-graphs.jpg +authors: [arthurf] +hide_table_of_contents: false --- import useBaseUrl from '@docusaurus/useBaseUrl'; @@ -148,3 +146,4 @@ outputs: Flame graph viewer +Flame graph viewer diff --git a/website/blog/2020-08-10-introducing-QA-Board.md b/website/blog/2020-08-10-introducing-QA-Board.md index 15ca1925..204f0106 100644 --- a/website/blog/2020-08-10-introducing-QA-Board.md +++ b/website/blog/2020-08-10-introducing-QA-Board.md @@ -1,15 +1,12 @@ --- title: Introducing QA-Board -author: Arthur Flam -author_url: https://shapescience.xyz/ -author_title: Algo engineering at Samsung -author_image_url: https://media-exp1.licdn.com/dms/image/C4D03AQFO_tBlzPZ4ug/profile-displayphoto-shrink_400_400/0?e=1602720000&v=beta&t=35CS2a0jRg32mhVbwpqbddP8HJsFp75hLeQJjAHQHCw +authors: [arthurf] tags: [qualityOps, engineering] # description: Some description # image: https://example.com/image.png --- -We are happy to introduce [QA-Board](samsung.github.io/qaboard) ([source](https://github.com/samsung/qaboard)), a run-tracker with advanced visualizations for algorithm and software engineers. +We are happy to introduce [QA-Board](https://samsung.github.io/qaboard) ([source](https://github.com/samsung/qaboard)), a run-tracker with advanced visualizations for algorithm and software engineers. @@ -49,10 +46,10 @@ QA-Board has become a key collaborative tool. Our main use-cases are: - **Regression**: users can check the progress on various metrics, and when needed, identify which commit caused a regression. - **Performance engineering**: save [`rr`](https://rr-project.org/)/[`perf`](http://www.brendangregg.com/perf.html) recordings, view [flame graphs](http://www.brendangregg.com/flamegraphs.html), [benchmark drivers](https://github.com/arthur-flam/sysbench-qaboard), and track metrics for regressions. -> Here are some screenshots: +> Here are some screenshots (from slide 7):
- +
diff --git a/website/blog/authors.yml b/website/blog/authors.yml new file mode 100644 index 00000000..8d3b55dd --- /dev/null +++ b/website/blog/authors.yml @@ -0,0 +1,5 @@ +arthurf: + name: Arthur Flam + title: Algo engineering at Samsung + url: https://shapescience.xyz/ + image_url: https://avatars.githubusercontent.com/u/2649055 \ No newline at end of file diff --git a/website/build-search-data.js b/website/build-search-data.js deleted file mode 100755 index fe20d265..00000000 --- a/website/build-search-data.js +++ /dev/null @@ -1,116 +0,0 @@ -const fs = require("fs-extra"); -const path = require("path"); -const cheerio = require("cheerio"); - -const BUILD_PATH = "./build/"; -const SEARCH_DATA_LOCATION = "./src/theme/SearchBar/search-data.js"; - -const SEARCH_DATA = []; -const sectionHeaderElements = ["h2", "h3"]; - -const getContent = element => { - const text = - element.is("table") || element.find("table").length !== 0 - ? element.html().replace(/<[^>]*>/g, " ") - : element.text(); - return text.replace(/\s\s+/g, " ").replace(/(\r\n|\n|\r)/gm, " "); -}; - -const getSectionContent = function(section) { - let content = ""; - section = section.next(); - while (section.length) { - if (sectionHeaderElements.some(s => section.is(s))) break; - content += getContent(section) + " "; - section = section.next(); - } - return content; -}; - -const searchDirectory = (startPath, extension, callback) => { - if (!fs.existsSync(startPath)) { - return; - } - - const files = fs.readdirSync(startPath); - files.forEach(file => { - const filePath = path.join(startPath, file); - const stats = fs.lstatSync(filePath); - if (stats.isDirectory()) { - searchDirectory(filePath, extension, callback); - } else if (path.extname(filePath) === extension) { - callback(filePath); - } - }); -}; - -// Build search data for a html -const buildSearchData = filePath => { - const htmlFile = fs.readFileSync(filePath); - // const dom = new JSDOM(htmlFile); - const $ = cheerio.load(htmlFile); - - const article = $("article"); - if (!article.length) { - return; - } - const markdown = article.find(".markdown"); - if (!markdown.length) { - return; - } - - let baseUrl = filePath.split(path.sep); - // remove build folder path from url - baseUrl.splice(0, 1); - // remove index.html from the path - baseUrl.pop(); - baseUrl = baseUrl.join("/"); - const pageTitleElement = article.find("h1"); - if (!pageTitleElement.length) { - return; - } - const pageTitle = article.find("h1").text(); - const sectionHeaders = sectionHeaderElements.reduce((acc, selector) => { - acc = acc.concat(Array.from(markdown.find(selector))); - return acc; - }, []); - - SEARCH_DATA.push({ - title: pageTitle, - type: 0, - sectionRef: "#", - url: baseUrl, - // If there is no sections then push the complete content under page title - content: sectionHeaders.length === 0 ? getContent(markdown) : "" - }); - - sectionHeaders.forEach(sectionHeader => { - sectionHeader = $(sectionHeader); - const title = sectionHeader.text().slice(1); - const sectionRef = sectionHeader - .children() - .first() - .attr("id"); - const url = `${baseUrl}#${sectionRef}`; - const content = getSectionContent(sectionHeader); - SEARCH_DATA.push({ - title, - type: 1, - pageTitle, - url, - content - }); - }); -}; - -const init = () => { - searchDirectory(BUILD_PATH, ".html", buildSearchData); - fs.writeFile( - SEARCH_DATA_LOCATION, - ` - export default ${JSON.stringify(SEARCH_DATA, null, 2)} - ` - ); -}; - -init(); diff --git a/website/docs/introduction.md b/website/docs/introduction.md index 0c46b0e2..49a8d314 100755 --- a/website/docs/introduction.md +++ b/website/docs/introduction.md @@ -28,8 +28,9 @@ QA-Board has become a key collaborative tool at Samsung SIRC. Our main use-cases - **Regression**: users can check the progress on various metrics, and when needed, identify which commit caused a regression. - **Performance engineering**: save [`rr`](https://rr-project.org/)/[`perf`](http://www.brendangregg.com/perf.html) recordings, view [flame graphs](http://www.brendangregg.com/flamegraphs.html) and track metrics for regressions. -> Here are some screenshots: +> Here are some screenshots, from slide 7:
- +
diff --git a/website/docs/tuning-from-the-webapp.md b/website/docs/tuning-from-the-webapp.md index 484b81ea..606bc1b0 100644 --- a/website/docs/tuning-from-the-webapp.md +++ b/website/docs/tuning-from-the-webapp.md @@ -13,7 +13,7 @@ When doing QA or during development, you often want to run the code/configs from ## Enabling tuning from QA-Board ### 1. Build artifacts -You must have defined and be using [artifacts](/storage/artifacts) +You must have defined and be using [artifacts](artifacts) ### 2. Distributed task queue You need to configure a task runner, that will execute tuning runs asynchronously. We recommend getting started with Celery. All the details are on the [next page](celery-integration)! diff --git a/website/docs/tuning-workflows.md b/website/docs/tuning-workflows.md index d380075a..76102689 100755 --- a/website/docs/tuning-workflows.md +++ b/website/docs/tuning-workflows.md @@ -30,7 +30,7 @@ If you already have great development/debugging tools, use them! > You can continue to use the existing tools! -This said, it's worth having your IDE/debugger/scripts call your code via QA-Board's `qa` CLI. [Here is how to do it](debugging). +This said, it's worth having your IDE/debugger/scripts call your code via QA-Board's `qa` CLI. [Here is how to do it](debugging-runs-with-an-IDE). ### **Local configs > SharedStorage > Tuning from QA-Board** Workflow > Details: WIP diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js old mode 100755 new mode 100644 index eafc4e3b..b97686eb --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -1,157 +1,172 @@ -const publish_github_samsung_private = process.env.PUBLISH === 'github_samsung_private' -const publish_github_samsung_public = process.env.PUBLISH === 'github_samsung_public' -const is_for_webapp = !publish_github_samsung_private && !publish_github_samsung_public - -// See https://docusaurus.io/docs/site-config for all the possible site configuration options. -const logo = { - alt: 'QA-Board Logo', - // https://commons.wikimedia.org/wiki/File:Twemoji_1f429.svg - src: 'img/twemoji_poodle.svg', -} - -var config = { - title: 'QA-Board', - tagline: "Algorithm engineering is hard enough.
Don't waste time with logistics.", - // You may provide arbitrary config keys to be used as needed by your - // template. For example, if you need your repo's URL... - - // scripts: [ - // Add custom scripts here that would be placed in