Skip to content

Commit e4e7e0f

Browse files
isaacroldanisaacroldan
authored
Merge pull request #5322 from Shopify/01-30-remove_all_traces_of_dev-sessions_from_dev.tsx
Remove all traces of dev-sessions from Dev.tsx
2 parents 70f3a8a + f369481 commit e4e7e0f

File tree

2 files changed

+9
-187
lines changed

2 files changed

+9
-187
lines changed

‎packages/app/src/cli/services/dev/ui/components/Dev.test.tsx‎

Lines changed: 0 additions & 153 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import {calculatePrefixColumnSize, Dev} from './Dev.js'
22
import {fetchAppPreviewMode} from '../../fetch.js'
33
import {testDeveloperPlatformClient, testUIExtension} from '../../../../models/app/app.test-data.js'
4-
import {devSessionStatusManager} from '../../processes/dev-session-status-manager.js'
54
import {
65
getLastFrameAfterUnmount,
76
render,
@@ -341,7 +340,6 @@ describe('Dev', () => {
341340
"
342341
`)
343342
expect(developerPreview.disable).toHaveBeenCalledOnce()
344-
expect(testApp.developerPlatformClient.devSessionDelete).toHaveBeenCalledOnce()
345343

346344
// unmount so that polling is cleared after every test
347345
renderInstance.unmount()
@@ -407,7 +405,6 @@ describe('Dev', () => {
407405
"
408406
`)
409407
expect(developerPreview.disable).toHaveBeenCalledOnce()
410-
expect(testApp.developerPlatformClient.devSessionDelete).toHaveBeenCalledOnce()
411408

412409
// unmount so that polling is cleared after every test
413410
renderInstance.unmount()
@@ -976,156 +973,6 @@ describe('Dev', () => {
976973
// unmount so that polling is cleared after every test
977974
renderInstance.unmount()
978975
})
979-
980-
test('updates UI when devSessionEnabled changes from false to true', async () => {
981-
// Given
982-
devSessionStatusManager.updateStatus({isReady: false})
983-
984-
const renderInstance = render(
985-
<Dev
986-
processes={[]}
987-
abortController={new AbortController()}
988-
previewUrl="https://shopify.com"
989-
graphiqlUrl="https://graphiql.shopify.com"
990-
graphiqlPort={1234}
991-
app={{
992-
...testApp,
993-
canEnablePreviewMode: false,
994-
developerPlatformClient: {
995-
...testDeveloperPlatformClient(),
996-
supportsDevSessions: true,
997-
},
998-
}}
999-
developerPreview={developerPreview}
1000-
shopFqdn="mystore.shopify.io"
1001-
/>,
1002-
)
1003-
1004-
await waitForInputsToBeReady()
1005-
1006-
// Initial state - dev session not ready
1007-
expect(unstyled(renderInstance.lastFrame()!).replace(/\d/g, '0')).toMatchInlineSnapshot(`
1008-
"
1009-
────────────────────────────────────────────────────────────────────────────────────────────────────
1010-
1011-
› Press q │ quit
1012-
1013-
Preview URL: https://shopify.com
1014-
GraphiQL URL: http://localhost:0000/graphiql
1015-
"
1016-
`)
1017-
1018-
// When dev session becomes ready
1019-
devSessionStatusManager.updateStatus({isReady: true, previewURL: 'https://shopify.com'})
1020-
1021-
// Wait for the polling interval to update the UI
1022-
await waitForContent(renderInstance, 'preview in your browser')
1023-
1024-
// Then - preview shortcut should be visible
1025-
expect(unstyled(renderInstance.lastFrame()!).replace(/\d/g, '0')).toMatchInlineSnapshot(`
1026-
"
1027-
────────────────────────────────────────────────────────────────────────────────────────────────────
1028-
1029-
› Press g │ open GraphiQL (Admin API) in your browser
1030-
› Press p │ preview in your browser
1031-
› Press q │ quit
1032-
1033-
Preview URL: https://shopify.com
1034-
GraphiQL URL: http://localhost:0000/graphiql
1035-
"
1036-
`)
1037-
1038-
// unmount so that polling is cleared after every test
1039-
renderInstance.unmount()
1040-
})
1041-
1042-
test('updates preview URL when devSessionStatus provides a new URL', async () => {
1043-
// Given
1044-
const initialPreviewUrl = 'https://shopify.com'
1045-
const newPreviewUrl = 'https://my-new-preview-url.shopify.com'
1046-
devSessionStatusManager.updateStatus({isReady: true, previewURL: undefined})
1047-
1048-
const renderInstance = render(
1049-
<Dev
1050-
processes={[]}
1051-
abortController={new AbortController()}
1052-
previewUrl={initialPreviewUrl}
1053-
graphiqlUrl="https://graphiql.shopify.com"
1054-
graphiqlPort={1234}
1055-
app={{
1056-
...testApp,
1057-
developerPlatformClient: {
1058-
...testDeveloperPlatformClient(),
1059-
supportsDevSessions: true,
1060-
},
1061-
}}
1062-
developerPreview={developerPreview}
1063-
shopFqdn="mystore.shopify.io"
1064-
/>,
1065-
)
1066-
1067-
await waitForInputsToBeReady()
1068-
1069-
// Initial state should show the default preview URL
1070-
expect(unstyled(renderInstance.lastFrame()!)).toContain(`Preview URL: ${initialPreviewUrl}`)
1071-
1072-
// When dev session provides a new preview URL
1073-
devSessionStatusManager.updateStatus({isReady: true, previewURL: newPreviewUrl})
1074-
1075-
// Wait for the polling interval to update the UI
1076-
await waitForContent(renderInstance, newPreviewUrl)
1077-
1078-
// Then - status message should show the new preview URL
1079-
expect(unstyled(renderInstance.lastFrame()!)).toContain(`Preview URL: ${newPreviewUrl}`)
1080-
1081-
// unmount so that polling is cleared after every test
1082-
renderInstance.unmount()
1083-
})
1084-
1085-
test('opens the updated preview URL when p is pressed after URL changes', async () => {
1086-
// Given
1087-
const initialPreviewUrl = 'https://shopify.com'
1088-
const newPreviewUrl = 'https://my-new-preview-url.shopify.com'
1089-
devSessionStatusManager.updateStatus({isReady: true, previewURL: undefined})
1090-
1091-
const renderInstance = render(
1092-
<Dev
1093-
processes={[]}
1094-
abortController={new AbortController()}
1095-
previewUrl={initialPreviewUrl}
1096-
graphiqlUrl="https://graphiql.shopify.com"
1097-
graphiqlPort={1234}
1098-
app={{
1099-
...testApp,
1100-
developerPlatformClient: {
1101-
...testDeveloperPlatformClient(),
1102-
supportsDevSessions: true,
1103-
},
1104-
}}
1105-
developerPreview={developerPreview}
1106-
shopFqdn="mystore.shopify.io"
1107-
/>,
1108-
)
1109-
1110-
await waitForInputsToBeReady()
1111-
1112-
// Initial state should show the default preview URL
1113-
expect(unstyled(renderInstance.lastFrame()!)).toContain(`Preview URL: ${initialPreviewUrl}`)
1114-
1115-
// When dev session provides a new preview URL
1116-
devSessionStatusManager.updateStatus({isReady: true, previewURL: newPreviewUrl})
1117-
1118-
// Wait for the polling interval to update the UI
1119-
await waitForContent(renderInstance, newPreviewUrl)
1120-
1121-
await waitForInputsToBeReady()
1122-
await sendInputAndWait(renderInstance, 100, 'p')
1123-
1124-
// Then
1125-
expect(vi.mocked(openURL)).toHaveBeenNthCalledWith(1, newPreviewUrl)
1126-
1127-
renderInstance.unmount()
1128-
})
1129976
})
1130977

1131978
describe('calculatePrefixColumnSize', () => {

‎packages/app/src/cli/services/dev/ui/components/Dev.tsx‎

Lines changed: 9 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import metadata from '../../../../metadata.js'
22
import {DeveloperPlatformClient} from '../../../../utilities/developer-platform-client.js'
33
import {ExtensionInstance} from '../../../../models/extensions/extension-instance.js'
4-
import {devSessionStatusManager, DevSessionStatus} from '../../processes/dev-session-status-manager.js'
54
import {OutputProcess} from '@shopify/cli-kit/node/output'
65
import {ConcurrentOutput} from '@shopify/cli-kit/node/ui/components'
76
import {useAbortSignal} from '@shopify/cli-kit/node/ui/hooks'
@@ -59,7 +58,6 @@ const Dev: FunctionComponent<DevProps> = ({
5958
pollingTime = 5000,
6059
developerPreview,
6160
isEditionWeek,
62-
shopFqdn,
6361
}) => {
6462
const {canEnablePreviewMode, developmentStorePreviewEnabled} = app
6563

@@ -70,8 +68,6 @@ const Dev: FunctionComponent<DevProps> = ({
7068

7169
const [isShuttingDownMessage, setIsShuttingDownMessage] = useState<string | undefined>(undefined)
7270
const [devPreviewEnabled, setDevPreviewEnabled] = useState<boolean>(true)
73-
const [devSessionEnabled, setDevSessionEnabled] = useState<boolean>(devSessionStatusManager.status.isReady)
74-
const [appPreviewURL, setAppPreviewURL] = useState<string>(previewUrl)
7571
const [error, setError] = useState<string | undefined>(undefined)
7672

7773
const {isAborted} = useAbortSignal(abortController.signal, async (err) => {
@@ -87,7 +83,6 @@ const Dev: FunctionComponent<DevProps> = ({
8783
}, 2000)
8884
}
8985
clearInterval(pollingInterval.current)
90-
await app.developerPlatformClient.devSessionDelete({appId: app.id, shopFqdn})
9186
await developerPreview.disable()
9287
})
9388

@@ -107,24 +102,6 @@ const Dev: FunctionComponent<DevProps> = ({
107102
})
108103
}, [processes, abortController])
109104

110-
// Subscribe to dev session status updates
111-
useEffect(() => {
112-
const handleDevSessionUpdate = (status: DevSessionStatus) => {
113-
setDevSessionEnabled(status.isReady)
114-
if (status.previewURL) setAppPreviewURL(status.previewURL)
115-
}
116-
117-
if (app.developerPlatformClient.supportsDevSessions) {
118-
devSessionStatusManager.on('dev-session-update', handleDevSessionUpdate)
119-
} else {
120-
setDevSessionEnabled(true)
121-
}
122-
123-
return () => {
124-
devSessionStatusManager.off('dev-session-update', handleDevSessionUpdate)
125-
}
126-
}, [])
127-
128105
useEffect(() => {
129106
const pollDevPreviewMode = async () => {
130107
try {
@@ -179,12 +156,12 @@ const Dev: FunctionComponent<DevProps> = ({
179156
try {
180157
setError('')
181158

182-
if (input === 'p' && appPreviewURL && devSessionEnabled) {
159+
if (input === 'p' && previewUrl) {
183160
await metadata.addPublicMetadata(() => ({
184161
cmd_dev_preview_url_opened: true,
185162
}))
186-
await openURL(appPreviewURL)
187-
} else if (input === 'g' && graphiqlUrl && devSessionEnabled) {
163+
await openURL(previewUrl)
164+
} else if (input === 'g' && graphiqlUrl) {
188165
await metadata.addPublicMetadata(() => ({
189166
cmd_dev_graphiql_opened: true,
190167
}))
@@ -233,7 +210,7 @@ const Dev: FunctionComponent<DevProps> = ({
233210
prefixColumnSize={calculatePrefixColumnSize(errorHandledProcesses, app.extensions)}
234211
abortSignal={abortController.signal}
235212
keepRunningAfterProcessesResolve={true}
236-
useAlternativeColorPalette={app.developerPlatformClient.supportsDevSessions}
213+
useAlternativeColorPalette={false}
237214
/>
238215
{/* eslint-disable-next-line no-negated-condition */}
239216
{!isAborted ? (
@@ -263,17 +240,15 @@ const Dev: FunctionComponent<DevProps> = ({
263240
{devPreviewEnabled ? <Text color="green">✔ on</Text> : <Text color="red">✖ off</Text>}
264241
</Text>
265242
) : null}
266-
{graphiqlUrl && devSessionEnabled ? (
243+
{graphiqlUrl ? (
267244
<Text>
268245
{figures.pointerSmall} Press <Text bold>g</Text> {figures.lineVertical} open GraphiQL (Admin API) in
269246
your browser
270247
</Text>
271248
) : null}
272-
{devSessionEnabled ? (
273-
<Text>
274-
{figures.pointerSmall} Press <Text bold>p</Text> {figures.lineVertical} preview in your browser
275-
</Text>
276-
) : null}
249+
<Text>
250+
{figures.pointerSmall} Press <Text bold>p</Text> {figures.lineVertical} preview in your browser
251+
</Text>
277252
<Text>
278253
{figures.pointerSmall} Press <Text bold>q</Text> {figures.lineVertical} quit
279254
</Text>
@@ -285,7 +260,7 @@ const Dev: FunctionComponent<DevProps> = ({
285260
<Text>{isShuttingDownMessage}</Text>
286261
) : (
287262
<>
288-
<Text>{`Preview URL: ${appPreviewURL}`}</Text>
263+
<Text>{`Preview URL: ${previewUrl}`}</Text>
289264
{graphiqlUrl ? <Text>{graphiqlURLMessage}</Text> : null}
290265
</>
291266
)}

0 commit comments

Comments
 (0)