chore: Update relative references to internal packages to @packages references (#30984)

* Update relative references to frontend-shared to packages/frontend-shared

* fix typo

* Let's not reference our own package...

packages/app/cypress/component/support/index.ts

@@ -1,5 +1,5 @@
 /// <reference path="../../../../frontend-shared/cypress/support/component.ts" />
-import '../../../../frontend-shared/cypress/support/component.ts'
+import '@packages/frontend-shared/cypress/support/component.ts'
 import { registerMountFn } from '@packages/frontend-shared/cypress/support/common'
 
 import { createRouter } from '../../../src/router/router'

packages/app/src/components/SpecPatternModal.vue

@@ -13,7 +13,7 @@
     >
       <SpecPatterns
         :gql="props.gql"
-        class="border-px rounded border-gray-100"
+        class="border-gray-100 rounded border-px"
       />
     </div>
     <StandardModalFooter
@@ -52,8 +52,8 @@ import { useI18n } from '@cy/i18n'
 import type { SpecPatternModalFragment } from '../generated/graphql'
 import { gql } from '@urql/core'
 import StandardModalFooter from '@cy/components/StandardModalFooter.vue'
-import Button from '../../../frontend-shared/src/components/Button.vue'
-import OpenConfigFileInIDE from '../../../frontend-shared/src/gql-components/OpenConfigFileInIDE.vue'
+import Button from '@packages/frontend-shared/src/components/Button.vue'
+import OpenConfigFileInIDE from '@packages/frontend-shared/src/gql-components/OpenConfigFileInIDE.vue'
 
 gql`
 fragment SpecPatternModal on CurrentProject {

packages/app/src/runner/automation/AutomationMissing.vue

@@ -56,7 +56,7 @@ import type { AutomationMissingFragment } from '../../generated/graphql'
 import SpecRunnerDropdown from '../SpecRunnerDropdown.vue'
 import { ref } from 'vue'
 import { allBrowsersIcons } from '@packages/frontend-shared/src/assets/browserLogos'
-import Alert from '../../../../frontend-shared/src/components/Alert.vue'
+import Alert from '@packages/frontend-shared/src/components/Alert.vue'
 import ErrorOutlineIcon from '~icons/cy/status-errored-outline_x16.svg'
 
 const { t } = useI18n()

packages/app/src/runner/studio/StudioSaveModal.vue

@@ -10,7 +10,7 @@
       {{ t('runner.studio.saveTest') }}
     </template>
 
-    <div class="max-w-sm w-sm py-5 px-5">
+    <div class="max-w-sm px-5 py-5 w-sm">
       <form
         class="flex items-center justify-evenly"
         @submit="submit"
@@ -32,10 +32,10 @@
             :disabled="!testName"
           >
             <div class="rounded-md flex bg-indigo-500 py-1.5 px-1 align-center hover:bg-indigo-400">
-              <div class="ml-2 pt-1">
+              <div class="pt-1 ml-2">
                 <i-cy-circle-check_x16 class="fill-gray-200 stroke-gray-1000" />
               </div>
-              <div class="font-medium mx-2 text-white">
+              <div class="mx-2 font-medium text-white">
                 {{ t('runner.studio.saveTestButton') }}
               </div>
             </div>
@@ -50,7 +50,7 @@
 import { useI18n } from '@cy/i18n'
 import StandardModal from '@packages/frontend-shared/src/components/StandardModal.vue'
 import { ref } from 'vue'
-import Input from '../../../../frontend-shared/src/components/Input.vue'
+import Input from '@packages/frontend-shared/src/components/Input.vue'
 import { useStudioStore } from '../../store/studio-store'
 
 const { t } = useI18n()

packages/app/src/runs/RunsErrorRenderer.vue

@@ -30,7 +30,7 @@
     >
       <CodeTag
         bg
-        class="bg-purple-50 text-purple-500"
+        class="text-purple-500 bg-purple-50"
       >
         projectId: "{{ currentProject?.projectId }}"
       </CodeTag>
@@ -69,7 +69,7 @@ import type { RunsErrorRendererFragment } from '../generated/graphql'
 import ConnectIcon from '~icons/cy/chain-link_x16.svg'
 import SendIcon from '~icons/cy/paper-airplane_x16.svg'
 import { useI18n } from '@cy/i18n'
-import CodeTag from '../../../frontend-shared/src/components/CodeTag.vue'
+import CodeTag from '@packages/frontend-shared/src/components/CodeTag.vue'
 import ExternalLink from '@cy/gql-components/ExternalLink.vue'
 import { useUserProjectStatusStore } from '@packages/frontend-shared/src/store/user-project-status-store'
 

packages/app/src/settings/project/Experiments.cy.tsx

@@ -1,5 +1,5 @@
 import { ExperimentsFragmentDoc } from '../../generated/graphql-test'
-import config from '../../../../frontend-shared/cypress/fixtures/config.json'
+import config from '@packages/frontend-shared/cypress/fixtures/config.json'
 import Experiments from './Experiments.vue'
 import { defaultMessages } from '@cy/i18n'
 

packages/app/vite.config.mjs

@@ -1,4 +1,4 @@
-import { makeConfig } from '../frontend-shared/vite.config.mjs'
+import { makeConfig } from '@packages/frontend-shared/vite.config.mjs'
 import Layouts from 'vite-plugin-vue-layouts'
 import Pages from 'vite-plugin-pages'
 import Copy from 'rollup-plugin-copy'

packages/launchpad/cypress/component/support/commands.ts

@@ -1,2 +1,2 @@
 /// <reference path="../../../../frontend-shared/cypress/support/component.ts" />
-import '../../../../frontend-shared/cypress/support/component.ts'
+import '@packages/frontend-shared/cypress/support/component.ts'

packages/launchpad/cypress/e2e/scaffold-project.cy.ts

@@ -1,4 +1,4 @@
-import type { SnapshotScaffoldTestResult } from '@packages/launchpad/cypress/tasks/snapshotsScaffold'
+import type { SnapshotScaffoldTestResult } from '../tasks/snapshotsScaffold'
 
 // The tests in this file take an existing project without Cypress Configured
 // and add Cypress using the launchpad setup wizard.

packages/launchpad/cypress/e2e/support/e2eSupport.ts

@@ -1,5 +1,5 @@
 /// <reference path="../../../../frontend-shared/cypress/support/e2e.ts" />
-require('../../../../frontend-shared/cypress/support/e2e')
+require('@packages/frontend-shared/cypress/support/e2e')
 
 require('./dropFileWithPath')
 require('./containsPath')

packages/launchpad/src/migration/ConvertConfigFile.vue

@@ -135,7 +135,7 @@
 import { computed } from 'vue'
 import CodeTag from '@cy/components/CodeTag.vue'
 import BeforeAfter from './fragments/BeforeAfter.vue'
-import ShikiHighlight from '../../../frontend-shared/src/components/ShikiHighlight.vue'
+import ShikiHighlight from '@packages/frontend-shared/src/components/ShikiHighlight.vue'
 import MigrationList from './fragments/MigrationList.vue'
 import MigrationTitle from './fragments/MigrationTitle.vue'
 import { useI18n } from '@cy/i18n'

packages/launchpad/vite.config.mjs

@@ -1,3 +1,3 @@
-import ViteConfig from '../frontend-shared/vite.config.mjs'
+import ViteConfig from '@packages/frontend-shared/vite.config.mjs'
 
 export default ViteConfig