Merge branch 'unified-desktop-gui' into tgriesser/unify/ui-data-push

* unified-desktop-gui:
  feat: add remove project button (#18381)
  fix(launchpad): prevent code colors from leaking out of reporter (#18382)
  Fix README on unified-desktop-gui

Author: tgriesser

README.md

@@ -1,142 +1,79 @@
 <p align="center">
-  <a href="" rel="noopener">
- <img width=200px height=200px src="https://i.imgur.com/FxL5qM0.jpg" alt="Bot logo"></a>
+  <img src="https://cloud.githubusercontent.com/assets/1268976/20607953/d7ae489c-b24a-11e6-9cc4-91c6c74c5e88.png"/>
 </p>
-
-<h3 align="center">cypress</h3>
-
-<div align="center">
-
-[![Status](https://img.shields.io/badge/status-active-success.svg)]()
-[![Platform](https://img.shields.io/badge/platform-reddit-orange.svg)](https://www.reddit.com/user/Wordbook_Bot)
-[![GitHub Issues](https://img.shields.io/github/issues/kylelobo/The-Documentation-Compendium.svg)](https://github.com/kylelobo/The-Documentation-Compendium/issues)
-[![GitHub Pull Requests](https://img.shields.io/github/issues-pr/kylelobo/The-Documentation-Compendium.svg)](https://github.com/kylelobo/The-Documentation-Compendium/pulls)
-[![License](https://img.shields.io/badge/license-MIT-blue.svg)](/LICENSE)
-
-</div>
-
----
-
-<p align="center"> 🤖 Few lines describing what your bot does.
-    <br> 
+<p align="center">
+  <a href="https://on.cypress.io">Documentation</a> |
+  <a href="https://on.cypress.io/changelog">Changelog</a> |
+  <a href="https://on.cypress.io/roadmap">Roadmap</a>
 </p>
 
-## 📝 Table of Contents
-
-- [About](#about)
-- [Demo / Working](#demo)
-- [How it works](#working)
-- [Usage](#usage)
-- [Getting Started](#getting_started)
-- [Deploying your own bot](#deployment)
-- [Built Using](#built_using)
-- [TODO](../TODO.md)
-- [Contributing](../CONTRIBUTING.md)
-- [Authors](#authors)
-- [Acknowledgments](#acknowledgement)
-
-## 🧐 About <a name = "about"></a>
-
-Write about 1-2 paragraphs describing the purpose of your bot.
-
-## 🎥 Demo / Working <a name = "demo"></a>
-
-![Working](https://media.giphy.com/media/20NLMBm0BkUOwNljwv/giphy.gif)
+<h3 align="center">
+  The web has evolved. Finally, testing has too.
+</h3>
 
-## 💭 How it works <a name = "working"></a>
+<p align="center">
+  Fast, easy and reliable testing for anything that runs in a browser.
+</p>
+<p align="center">
+  Join us, we're <a href="https://cypress.io/jobs">hiring</a>.
+</p>
 
-The bot first extracts the word from the comment and then fetches word definitions, part of speech, example and source from the Oxford Dictionary API.
+<p align="center">
+  <a href="https://www.npmjs.com/package/cypress">
+    <img src="https://img.shields.io/npm/dm/cypress.svg" alt="npm"/>
+  </a>
+  <a href="https://gitter.im/cypress-io/cypress">
+    <img src="https://img.shields.io/gitter/room/cypress-io/cypress.svg" alt="Gitter chat"/>
+  </a>
+    <a href="https://stackshare.io/cypress">
+    <img src="https://img.stackshare.io/misc/follow-on-stackshare-badge.svg" alt="StackShare"/>
+  </a><br />
+</p>
 
-If the word does not exist in the Oxford Dictionary, the Oxford API then returns a 404 response upon which the bot then tries to fetch results form the Urban Dictionary API.
+## What is Cypress?
 
-The bot uses the Pushshift API to fetch comments, PRAW module to reply to comments and Heroku as a server.
+<p align="center">
+  <a href="https://player.vimeo.com/video/237527670">
+    <img alt="Why Cypress Video" src="https://user-images.githubusercontent.com/1271364/31739717-dbdff0ee-b41c-11e7-9b16-bfa1b6ac1814.png" width="75%" height="75%" />
+  </a>
+</p>
 
-The entire bot is written in Python 3.6
+## Installing
 
-## 🎈 Usage <a name = "usage"></a>
+[![npm version](https://badge.fury.io/js/cypress.svg)](https://badge.fury.io/js/cypress)
 
-To use the bot, type:
+Install Cypress for Mac, Linux, or Windows, then [get started](https://docs.cypress.io/guides/getting-started/installing-cypress.html).
 
+```bash
+npm install cypress --save-dev
 ```
-!dict word
+or
+```bash
+yarn add cypress --dev
 ```
 
-The first part, i.e. "!dict" **is not** case sensitive.
-
-The bot will then give you the Oxford Dictionary (or Urban Dictionary; if the word does not exist in the Oxford Dictionary) definition of the word as a comment reply.
-
-### Example:
-
-> !dict what is love
+![installing-cli e1693232](https://user-images.githubusercontent.com/1271364/31740846-7bf607f0-b420-11e7-855f-41c996040d31.gif)
 
-**Definition:**
 
-Baby, dont hurt me~
-Dont hurt me~ no more.
+## Contributing
 
-**Example:**
+- [![CircleCI](https://circleci.com/gh/cypress-io/cypress/tree/develop.svg?style=svg)](https://circleci.com/gh/cypress-io/cypress/tree/develop) - `develop` branch
+- [![CircleCI](https://circleci.com/gh/cypress-io/cypress/tree/master.svg?style=svg)](https://circleci.com/gh/cypress-io/cypress/tree/master) - `master` branch
 
-Dude1: Bruh, what is love?
-Dude2: Baby, dont hurt me, dont hurt me- no more!
-Dude1: dafuq?
+Please see our [Contributing Guideline](./CONTRIBUTING.md) which explains repo organization, linting, testing, and other steps.
 
-**Source:** https://www.urbandictionary.com/define.php?term=what%20is%20love
+## License
 
----
+[![license](https://img.shields.io/badge/license-MIT-green.svg)](https://github.com/cypress-io/cypress/blob/master/LICENSE)
 
-<sup>Beep boop. I am a bot. If there are any issues, contact my [Master](https://www.reddit.com/message/compose/?to=PositivePlayer1&subject=/u/Wordbook_Bot)</sup>
+This project is licensed under the terms of the [MIT license](/LICENSE).
 
-<sup>Want to make a similar reddit bot? Check out: [GitHub](https://github.com/kylelobo/Reddit-Bot)</sup>
+## Badges
 
-## 🏁 Getting Started <a name = "getting_started"></a>
+Let the world know your project is using Cypress.io to test with this cool badge
 
-These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See [deployment](#deployment) for notes on how to deploy the project on a live system.
-
-### Prerequisites
-
-What things you need to install the software and how to install them.
-
-```
-Give examples
-```
-
-### Installing
-
-A step by step series of examples that tell you how to get a development env running.
-
-Say what the step will be
-
-```
-Give the example
-```
-
-And repeat
+[![Cypress.io](https://img.shields.io/badge/tested%20with-Cypress-04C38E.svg)](https://www.cypress.io/)
 
 ```
-until finished
+[![Cypress.io](https://img.shields.io/badge/tested%20with-Cypress-04C38E.svg)](https://www.cypress.io/)
 ```
-
-End with an example of getting some data out of the system or using it for a little demo.
-
-## 🚀 Deploying your own bot <a name = "deployment"></a>
-
-To see an example project on how to deploy your bot, please see my own configuration:
-
-- **Heroku**: https://github.com/kylelobo/Reddit-Bot#deploying_the_bot
-
-## ⛏️ Built Using <a name = "built_using"></a>
-
-- [PRAW](https://praw.readthedocs.io/en/latest/) - Python Reddit API Wrapper
-- [Heroku](https://www.heroku.com/) - SaaS hosting platform
-
-## ✍️ Authors <a name = "authors"></a>
-
-- [@kylelobo](https://github.com/kylelobo) - Idea & Initial work
-
-See also the list of [contributors](https://github.com/kylelobo/The-Documentation-Compendium/contributors) who participated in this project.
-
-## 🎉 Acknowledgements <a name = "acknowledgement"></a>
-
-- Hat tip to anyone whose code was used
-- Inspiration
-- References

packages/data-context/src/actions/ProjectActions.ts

@@ -1,7 +1,7 @@
 import type { MutationAddProjectArgs, MutationAppCreateConfigFileArgs, SpecType } from '@packages/graphql/src/gen/nxs.gen'
 import type { FindSpecs, FoundBrowser, FoundSpec, FullConfig, LaunchArgs, LaunchOpts, OpenProjectLaunchOptions } from '@packages/types'
 import path from 'path'
-import type { Maybe } from '../data/coreDataShape'
+import type { Maybe, ProjectShape } from '../data/coreDataShape'
 
 import type { DataContext } from '..'
 
@@ -16,6 +16,7 @@ export interface ProjectApiShape {
   initializeProject(args: LaunchArgs, options: OpenProjectLaunchOptions, browsers: FoundBrowser[]): Promise<unknown>
   launchProject(browser: FoundBrowser, spec: Cypress.Spec, options: LaunchOpts): void
   insertProjectToCache(projectRoot: string): void
+  removeProjectFromCache(projectRoot: string): void
   getProjectRootsFromCache(): Promise<string[]>
   clearLatestProjectsCache(): Promise<unknown>
 }
@@ -33,6 +34,14 @@ export class ProjectActions {
     return
   }
 
+  private get projects () {
+    return this.ctx.coreData.app.projects
+  }
+
+  private set projects (projects: ProjectShape[]) {
+    this.ctx.coreData.app.projects = projects
+  }
+
   async setActiveProject (projectRoot: string) {
     this.ctx.coreData.app.activeProject = {
       projectRoot,
@@ -66,14 +75,14 @@ export class ProjectActions {
   }
 
   async loadProjects () {
-    const projectRoots = await this.ctx._apis.projectApi.getProjectRootsFromCache()
+    const projectRoots = await this.api.getProjectRootsFromCache()
 
-    this.ctx.coreData.app.projects = [
-      ...this.ctx?.coreData?.app?.projects,
+    this.projects = [
+      ...this.projects,
       ...projectRoots.map((projectRoot) => ({ projectRoot })),
     ]
 
-    return this.ctx.coreData.app.projects
+    return this.projects
   }
 
   async initializeActiveProject () {
@@ -107,10 +116,10 @@ export class ProjectActions {
       throw new Error(`Cannot add ${args.path} as a project, it is not a directory`)
     }
 
-    const found = this.ctx.projectsList.find((x) => x.projectRoot === args.path)
+    const found = this.projects.find((x) => x.projectRoot === args.path)
 
     if (!found) {
-      this.ctx.coreData.app.projects.push({ projectRoot: args.path })
+      this.projects.push({ projectRoot: args.path })
       this.api.insertProjectToCache(args.path)
     }
 
@@ -136,8 +145,15 @@ export class ProjectActions {
     return this.api.launchProject(browser, spec, {})
   }
 
-  removeProject () {
-    //
+  removeProject (projectRoot: string) {
+    const found = this.ctx.projectsList.find((x) => x.projectRoot === projectRoot)
+
+    if (!found) {
+      throw new Error(`Cannot remove ${projectRoot}, it is not a known project`)
+    }
+
+    this.projects = this.projects.filter((project) => project.projectRoot !== projectRoot)
+    this.api.removeProjectFromCache(projectRoot)
   }
 
   syncProjects () {

packages/frontend-shared/cypress/support/mock-graphql/stubgql-Mutation.ts

@@ -35,4 +35,9 @@ export const stubMutation: MaybeResolver<Mutation> = {
 
     return {}
   },
+  removeProject (source, args, ctx) {
+    ctx.app.projects = ctx.app.projects.filter((p) => p.projectRoot !== args.path)
+
+    return ctx.app
+  },
 }

packages/frontend-shared/src/styles/prism.scss

@@ -0,0 +1,76 @@
+code[class*="language-"],
+pre[class*="language-"] {
+  @apply text-gray-500;
+	text-shadow: $white 0px 1px;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  @apply text-red-500;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  @apply text-jade-500;
+}
+
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string,
+.token.regex,
+.token.important,
+.token.variable {
+  @apply text-orange-500;
+  @apply bg-gray-50;
+}
+
+.token.operator,
+.token.punctuation {
+  @apply text-gray-500;
+}
+
+.token.atrule,
+.token.attr-value,
+.token.class-name {
+  @apply text-indigo-500;
+}
+
+.token.keyword,
+.token.function {
+  @apply text-purple-500;
+}
+
+.token.comment {
+  @apply text-gray-500;
+}
+
+.line-numbers .line-numbers-rows {
+  @apply border-r-0;
+}
+
+.line-numbers-rows > span:before {
+  @apply text-gray-200;
+}
+
+.line-highlight {
+  @apply bg-gray-100;
+
+	&:before {
+    @apply hidden;
+	}
+}
+
+.test-error-code-frame pre[data-line] {
+  @apply pl-2;
+  @apply relative;
+}

packages/graphql/schemas/schema.graphql

@@ -297,6 +297,9 @@ type Mutation {
   """Set the current navigation item"""
   navigationMenuSetItem(type: NavItem!): NavigationMenu
 
+  """Remove project from projects array and cache"""
+  removeProject(path: String!): App!
+
   """Set active project to run tests on"""
   setActiveProject(path: String!): App!
   triggerIpc: Boolean

packages/graphql/src/schemaTypes/objectTypes/gql-Mutation.ts

@@ -188,6 +188,19 @@ export const mutation = mutationType({
       },
     })
 
+    t.nonNull.field('removeProject', {
+      type: 'App',
+      description: 'Remove project from projects array and cache',
+      args: {
+        path: nonNull(stringArg()),
+      },
+      async resolve (_root, args, ctx) {
+        await ctx.actions.project.removeProject(args.path)
+
+        return ctx.appData
+      },
+    })
+
     t.nonNull.field('setActiveProject', {
       type: 'App',
       description: 'Set active project to run tests on',