expo-dev-launcher 6.0.0 → 6.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/android/build.gradle +3 -3
  3. package/android/src/debug/java/expo/modules/devlauncher/compose/BindingView.kt +4 -2
  4. package/android/src/debug/java/expo/modules/devlauncher/compose/DevLauncherBottomTabsNavigator.kt +4 -2
  5. package/android/src/debug/java/expo/modules/devlauncher/compose/models/BranchesViewModel.kt +57 -13
  6. package/android/src/debug/java/expo/modules/devlauncher/compose/primitives/Accordion.kt +40 -45
  7. package/android/src/debug/java/expo/modules/devlauncher/compose/routes/Profile.kt +98 -18
  8. package/android/src/debug/java/expo/modules/devlauncher/compose/routes/Updates.kt +3 -1
  9. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/BranchScreen.kt +171 -146
  10. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/BranchesScreen.kt +248 -150
  11. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/CrashReportScreen.kt +75 -46
  12. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/HomeScreen.kt +234 -238
  13. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/NoUpdatesScreen.kt +52 -35
  14. package/android/src/debug/java/expo/modules/devlauncher/compose/screens/SettingsScreen.kt +246 -107
  15. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/AccountAvatar.kt +17 -9
  16. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/AccountSelector.kt +63 -46
  17. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/ActionButton.kt +51 -3
  18. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/AppHeader.kt +70 -44
  19. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/BottomSheet.kt +42 -2
  20. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/BottomTabBar.kt +14 -10
  21. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/BottomTabButton.kt +46 -23
  22. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/DevelopmentServerHelp.kt +23 -16
  23. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/RunningAppCard.kt +65 -34
  24. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/ScreenHeaderContainer.kt +0 -5
  25. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/ServerUrlInput.kt +56 -17
  26. package/android/src/debug/java/expo/modules/devlauncher/compose/ui/SignUp.kt +20 -27
  27. package/android/src/main/res/drawable/arrow_right.xml +9 -0
  28. package/android/src/main/res/drawable/check_circle.xml +10 -0
  29. package/android/src/main/res/drawable/chevron_right.xml +10 -0
  30. package/android/src/main/res/drawable/copy.xml +13 -0
  31. package/android/src/main/res/drawable/expo_logo.xml +9 -0
  32. package/android/src/main/res/drawable/home.xml +10 -0
  33. package/android/src/main/res/drawable/inspect.xml +10 -0
  34. package/android/src/main/res/drawable/log_in.xml +12 -0
  35. package/android/src/main/res/drawable/pulse.xml +10 -0
  36. package/android/src/main/res/drawable/reload.xml +10 -0
  37. package/android/src/main/res/drawable/scan.xml +42 -0
  38. package/android/src/main/res/drawable/settings.xml +14 -0
  39. package/android/src/main/res/drawable/show_at_launch.xml +12 -0
  40. package/android/src/main/res/drawable/signal.xml +26 -0
  41. package/android/src/main/res/drawable/user.xml +13 -0
  42. package/ios/EXDevLauncherController.m +23 -4
  43. package/ios/SwiftUI/CrashReportView.swift +11 -3
  44. package/ios/SwiftUI/DevLauncherViews.swift +18 -2
  45. package/ios/SwiftUI/DevServersView.swift +2 -2
  46. package/ios/SwiftUI/HomeTabView.swift +4 -0
  47. package/ios/SwiftUI/Navigation/Navigation.swift +3 -0
  48. package/ios/SwiftUI/SettingsTabView.swift +4 -3
  49. package/package.json +4 -4
@@ -2,6 +2,7 @@ package expo.modules.devlauncher.compose.screens
2
2
 
3
3
  import androidx.compose.foundation.background
4
4
  import androidx.compose.foundation.layout.Arrangement
5
+ import androidx.compose.foundation.layout.Box
5
6
  import androidx.compose.foundation.layout.Column
6
7
  import androidx.compose.foundation.layout.Row
7
8
  import androidx.compose.foundation.layout.fillMaxSize
@@ -20,27 +21,30 @@ import androidx.compose.runtime.remember
20
21
  import androidx.compose.ui.Alignment
21
22
  import androidx.compose.ui.Modifier
22
23
  import androidx.compose.ui.draw.clip
24
+ import androidx.compose.ui.graphics.Color
23
25
  import androidx.compose.ui.res.painterResource
26
+ import androidx.compose.ui.text.font.FontWeight
24
27
  import androidx.compose.ui.text.style.TextAlign
25
28
  import androidx.compose.ui.text.style.TextOverflow
26
29
  import androidx.compose.ui.tooling.preview.Preview
30
+ import androidx.compose.ui.unit.dp
31
+ import androidx.compose.ui.unit.sp
27
32
  import com.composeunstyled.Button
28
33
  import com.composeunstyled.Icon
29
34
  import expo.modules.devlauncher.R
30
35
  import expo.modules.devlauncher.compose.Branch
36
+ import expo.modules.devlauncher.compose.DefaultScreenContainer
31
37
  import expo.modules.devlauncher.compose.Update
32
38
  import expo.modules.devlauncher.compose.models.BranchesAction
33
39
  import expo.modules.devlauncher.compose.primitives.CircularProgressBar
40
+ import expo.modules.devlauncher.compose.ui.ActionButton
34
41
  import expo.modules.devlauncher.compose.ui.AppHeader
35
- import expo.modules.devlauncher.compose.ui.ScreenHeaderContainer
36
42
  import expo.modules.devlauncher.compose.utils.DateFormat
37
- import expo.modules.devmenu.compose.primitives.DayNighIcon
43
+ import expo.modules.devmenu.compose.newtheme.NewAppTheme
38
44
  import expo.modules.devmenu.compose.primitives.Divider
39
- import expo.modules.devmenu.compose.primitives.Heading
45
+ import expo.modules.devmenu.compose.primitives.NewText
40
46
  import expo.modules.devmenu.compose.primitives.RoundedSurface
41
47
  import expo.modules.devmenu.compose.primitives.Spacer
42
- import expo.modules.devmenu.compose.primitives.Text
43
- import expo.modules.devmenu.compose.theme.Pallet
44
48
  import expo.modules.devmenu.compose.theme.Theme
45
49
  import kotlin.time.ExperimentalTime
46
50
 
@@ -48,20 +52,12 @@ import kotlin.time.ExperimentalTime
48
52
  fun BranchBadge(
49
53
  name: String
50
54
  ) {
51
- val backgroundColor = if (Theme.isDarkTheme) {
52
- Pallet.Dark.Blue.blue200
53
- } else {
54
- Pallet.Light.Blue.blue200
55
- }
56
-
57
- val textColor = if (Theme.isDarkTheme) {
58
- Pallet.Dark.Blue.blue800
59
- } else {
60
- Pallet.Light.Blue.blue800
61
- }
55
+ val backgroundColor = NewAppTheme.colors.background.info
56
+ val textColor = NewAppTheme.colors.text.link
62
57
 
63
58
  Row(
64
59
  verticalAlignment = Alignment.CenterVertically,
60
+ horizontalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`2`),
65
61
  modifier = Modifier
66
62
  .clip(RoundedCornerShape(Theme.sizing.borderRadius.medium))
67
63
  .background(backgroundColor)
@@ -71,10 +67,73 @@ fun BranchBadge(
71
67
  painter = painterResource(R.drawable.branch_icon),
72
68
  contentDescription = "Branch Icon",
73
69
  tint = textColor,
74
- modifier = Modifier.size(Theme.sizing.icon.extraSmall)
70
+ modifier = Modifier.size(12.dp)
75
71
  )
76
- Spacer(Theme.spacing.tiny)
77
- Text("Branch: $name", color = textColor)
72
+
73
+ NewText(
74
+ "Branch: $name",
75
+ style = NewAppTheme.font.sm,
76
+ color = textColor
77
+ )
78
+ }
79
+ }
80
+
81
+ @Composable
82
+ fun NeedToSingInComponent(
83
+ onProfileClick: () -> Unit = {}
84
+ ) {
85
+ Box(
86
+ contentAlignment = Alignment.Center,
87
+ modifier = Modifier.fillMaxSize()
88
+ ) {
89
+ Column(
90
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`4`),
91
+ horizontalAlignment = Alignment.CenterHorizontally,
92
+ modifier = Modifier.fillMaxWidth()
93
+ ) {
94
+ Icon(
95
+ painter = painterResource(R.drawable.log_in),
96
+ contentDescription = "Sign In Icon",
97
+ tint = NewAppTheme.colors.icon.info
98
+ )
99
+
100
+ Column(
101
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`2`),
102
+ horizontalAlignment = Alignment.CenterHorizontally,
103
+ modifier = Modifier.fillMaxWidth()
104
+ ) {
105
+ NewText(
106
+ "Sign in to view updates",
107
+ style = NewAppTheme.font.lg.merge(
108
+ fontWeight = FontWeight.SemiBold,
109
+ lineHeight = 20.sp,
110
+ textAlign = TextAlign.Center
111
+ )
112
+ )
113
+
114
+ NewText(
115
+ "Sign in to your Expo account to see available\nEAS updates for this project.",
116
+ style = NewAppTheme.font.sm.merge(
117
+ lineHeight = 19.6.sp,
118
+ textAlign = TextAlign.Center
119
+ ),
120
+ color = NewAppTheme.colors.text.secondary
121
+ )
122
+ }
123
+
124
+ ActionButton(
125
+ "Sign In",
126
+ foreground = Color.White,
127
+ background = Color.Black,
128
+ fill = false,
129
+ modifier = Modifier
130
+ .padding(
131
+ horizontal = NewAppTheme.spacing.`3`,
132
+ vertical = NewAppTheme.spacing.`2`
133
+ ),
134
+ onClick = onProfileClick
135
+ )
136
+ }
78
137
  }
79
138
  }
80
139
 
@@ -82,144 +141,180 @@ fun BranchBadge(
82
141
  @Composable
83
142
  fun BranchesScreen(
84
143
  branches: List<Branch> = emptyList(),
144
+ needToSignIn: Boolean = false,
85
145
  isLoading: Boolean = false,
86
146
  onProfileClick: () -> Unit = {},
87
147
  onAction: (BranchesAction) -> Unit = { _ -> }
88
148
  ) {
89
- Column(modifier = Modifier.fillMaxSize()) {
90
- ScreenHeaderContainer(modifier = Modifier.padding(Theme.spacing.medium)) {
91
- AppHeader(
92
- onProfileClick = onProfileClick
93
- )
149
+ Column(
150
+ modifier = Modifier.padding(horizontal = NewAppTheme.spacing.`4`)
151
+ ) {
152
+ Box(modifier = Modifier.padding(vertical = NewAppTheme.spacing.`4`)) {
153
+ AppHeader(onProfileClick = onProfileClick)
154
+ }
155
+
156
+ if (needToSignIn) {
157
+ NeedToSingInComponent(onProfileClick)
158
+ return@Column
94
159
  }
95
160
 
96
- Spacer(Theme.spacing.small)
161
+ Spacer(NewAppTheme.spacing.`4`)
97
162
 
98
- val lazyListState = rememberLazyListState()
163
+ Column {
164
+ val lazyListState = rememberLazyListState()
99
165
 
100
- val reachedBottom: Boolean by remember {
101
- derivedStateOf {
102
- val lastVisibleItem = lazyListState.layoutInfo.visibleItemsInfo.lastOrNull()
103
- val index = lastVisibleItem?.index ?: 0
104
- index != 0 && index > lazyListState.layoutInfo.totalItemsCount - 5
166
+ val reachedBottom: Boolean by remember {
167
+ derivedStateOf {
168
+ val lastVisibleItem = lazyListState.layoutInfo.visibleItemsInfo.lastOrNull()
169
+ val index = lastVisibleItem?.index ?: 0
170
+ index != 0 && index > lazyListState.layoutInfo.totalItemsCount - 5
171
+ }
105
172
  }
106
- }
107
173
 
108
- LaunchedEffect(reachedBottom) {
109
- if (reachedBottom && !isLoading) {
110
- onAction(BranchesAction.LoadMoreBranches)
174
+ LaunchedEffect(reachedBottom) {
175
+ if (reachedBottom && !isLoading) {
176
+ onAction(BranchesAction.LoadMoreBranches)
177
+ }
111
178
  }
112
- }
113
179
 
114
- RoundedSurface(modifier = Modifier.padding(Theme.spacing.small)) {
115
- LazyColumn(
116
- state = lazyListState
180
+ RoundedSurface(
181
+ color = NewAppTheme.colors.background.subtle
117
182
  ) {
118
- itemsIndexed(items = branches) { index, branch ->
119
- Column {
120
- Button(onClick = {
121
- onAction(BranchesAction.OpenBranch(branch.name))
122
- }) {
123
- Column(
124
- modifier = Modifier.padding(horizontal = Theme.spacing.medium, vertical = Theme.spacing.small)
183
+ LazyColumn(
184
+ state = lazyListState
185
+ ) {
186
+ itemsIndexed(items = branches) { index, branch ->
187
+ Column {
188
+ Button(
189
+ modifier = Modifier
190
+ .background(
191
+ NewAppTheme.colors.background.subtle,
192
+ shape = RoundedCornerShape(NewAppTheme.borderRadius.xl)
193
+ ),
194
+ onClick = {
195
+ onAction(BranchesAction.OpenBranch(branch.name))
196
+ }
125
197
  ) {
126
- Row(
127
- verticalAlignment = Alignment.CenterVertically,
128
- modifier = Modifier
129
- .fillMaxWidth()
198
+ Column(
199
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`2`),
200
+ modifier = Modifier.padding(NewAppTheme.spacing.`3`)
130
201
  ) {
131
- BranchBadge(branch.name)
132
-
133
- Spacer(modifier = Modifier.weight(1f))
134
-
135
- DayNighIcon(
136
- painter = painterResource(R.drawable.chevron_right_icon),
137
- contentDescription = "Chevron Right Icon",
138
- modifier = Modifier.size(Theme.sizing.icon.extraSmall)
139
- )
140
- }
141
-
142
- Spacer(Theme.spacing.small)
202
+ Row(
203
+ verticalAlignment = Alignment.CenterVertically,
204
+ horizontalArrangement = Arrangement.SpaceBetween,
205
+ modifier = Modifier
206
+ .fillMaxWidth()
207
+ ) {
208
+ BranchBadge(branch.name)
143
209
 
144
- val update = branch.compatibleUpdate
145
- if (update == null) {
146
- Row {
147
- Text(
148
- "No compatible update found for this branch.",
149
- color = Theme.colors.text.secondary,
150
- modifier = Modifier.weight(1f),
151
- textAlign = TextAlign.Center
210
+ Icon(
211
+ painter = painterResource(R.drawable.chevron_right),
212
+ contentDescription = "Chevron Icon",
213
+ tint = NewAppTheme.colors.icon.tertiary,
214
+ modifier = Modifier.size(16.dp)
152
215
  )
153
216
  }
154
- } else {
155
- val formatedTime = DateFormat.formatUpdateDate(update.createdAt)
156
217
 
157
- Row(
158
- verticalAlignment = Alignment.CenterVertically
159
- ) {
160
- DayNighIcon(
161
- painter = painterResource(R.drawable.update_icon),
162
- contentDescription = "Update Icon"
163
- )
218
+ val update = branch.compatibleUpdate
219
+ if (update == null) {
220
+ Row(
221
+ horizontalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`2`),
222
+ verticalAlignment = Alignment.CenterVertically
223
+ ) {
224
+ Icon(
225
+ painter = painterResource(expo.modules.devmenu.R.drawable.alert),
226
+ contentDescription = "Warning Icon",
227
+ tint = NewAppTheme.colors.icon.warning,
228
+ modifier = Modifier.size(20.dp)
229
+ )
164
230
 
165
- Spacer(Theme.spacing.small)
231
+ NewText(
232
+ "No compatible update found for this branch.",
233
+ color = NewAppTheme.colors.text.warning,
234
+ style = NewAppTheme.font.sm.merge(
235
+ fontWeight = FontWeight.Medium
236
+ )
237
+ )
238
+ }
239
+ } else {
240
+ val formatedTime = DateFormat.formatUpdateDate(update.createdAt)
166
241
 
167
- Column {
168
- Heading(
169
- "Update: \"${update.name}\"",
170
- fontSize = Theme.typography.medium,
171
- maxLines = 1,
172
- overflow = TextOverflow.Ellipsis,
173
- modifier = Modifier.padding(end = Theme.sizing.icon.medium + Theme.spacing.small)
242
+ Row(
243
+ verticalAlignment = Alignment.CenterVertically,
244
+ horizontalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`2`)
245
+ ) {
246
+ Icon(
247
+ painter = painterResource(R.drawable.update_icon),
248
+ contentDescription = "Update Icon",
249
+ tint = NewAppTheme.colors.icon.tertiary,
250
+ modifier = Modifier.size(20.dp)
174
251
  )
175
252
 
176
- Spacer(Theme.spacing.tiny)
253
+ Column(
254
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`1`),
255
+ modifier = Modifier.padding(end = 20.dp)
256
+ ) {
257
+ NewText(
258
+ "Update: \"${update.name}\"",
259
+ style = NewAppTheme.font.md.merge(
260
+ fontWeight = FontWeight.Medium
261
+ ),
262
+ maxLines = 1,
263
+ overflow = TextOverflow.Ellipsis
264
+ )
177
265
 
178
- Text(
179
- "Published: $formatedTime",
180
- color = Theme.colors.text.secondary
181
- )
266
+ NewText(
267
+ "Published: $formatedTime",
268
+ style = NewAppTheme.font.sm,
269
+ color = NewAppTheme.colors.text.secondary
270
+ )
271
+ }
182
272
  }
183
273
  }
184
274
  }
185
275
  }
186
- }
187
- }
188
- if (index < branches.size - 1) {
189
- Divider()
190
- }
191
- }
192
276
 
193
- if (isLoading) {
194
- item {
195
- Row(
196
- modifier = Modifier
197
- .fillMaxWidth()
198
- .padding(Theme.spacing.medium),
199
- horizontalArrangement = Arrangement.Center,
200
- verticalAlignment = Alignment.CenterVertically
201
- ) {
202
- CircularProgressBar(
203
- size = Theme.sizing.icon.large
204
- )
277
+ if (index < branches.size - 1) {
278
+ Divider(
279
+ thickness = 0.5.dp,
280
+ color = NewAppTheme.colors.border.default
281
+ )
282
+ }
205
283
  }
206
284
  }
207
- }
208
285
 
209
- if (!isLoading && branches.isEmpty()) {
210
- item {
211
- Row(
212
- modifier = Modifier
213
- .fillMaxWidth()
214
- .padding(Theme.spacing.medium),
215
- horizontalArrangement = Arrangement.Center,
216
- verticalAlignment = Alignment.CenterVertically
217
- ) {
218
- Text(
219
- "No branches available.",
220
- color = Theme.colors.text.secondary,
221
- textAlign = TextAlign.Center
222
- )
286
+ if (isLoading) {
287
+ item {
288
+ Row(
289
+ modifier = Modifier
290
+ .fillMaxWidth()
291
+ .padding(vertical = NewAppTheme.spacing.`2`),
292
+ horizontalArrangement = Arrangement.Center,
293
+ verticalAlignment = Alignment.CenterVertically
294
+ ) {
295
+ CircularProgressBar(
296
+ size = Theme.sizing.icon.large
297
+ )
298
+ }
299
+ }
300
+ } else if (branches.isEmpty()) {
301
+ item {
302
+ Row(
303
+ modifier = Modifier
304
+ .fillMaxWidth()
305
+ .padding(NewAppTheme.spacing.`3`),
306
+ horizontalArrangement = Arrangement.Center,
307
+ verticalAlignment = Alignment.CenterVertically
308
+ ) {
309
+ NewText(
310
+ "No branches available.",
311
+ style = NewAppTheme.font.lg.merge(
312
+ textAlign = TextAlign.Center,
313
+ fontWeight = FontWeight.Medium
314
+ ),
315
+ color = NewAppTheme.colors.text.secondary
316
+ )
317
+ }
223
318
  }
224
319
  }
225
320
  }
@@ -231,32 +326,35 @@ fun BranchesScreen(
231
326
  @Preview(showBackground = true)
232
327
  @Composable
233
328
  fun BranchesScreenPreview() {
234
- BranchesScreen(
235
- isLoading = false,
236
- branches = listOf(
237
- Branch(
238
- name = "main",
239
- compatibleUpdate = Update(
240
- id = "1",
241
- name = "Update 1",
242
- createdAt = "2022-09-15T19:29:12.244Z",
243
- isCompatible = true,
244
- permalink = ""
245
- )
246
- ),
247
- Branch(
248
- name = "develop",
249
- compatibleUpdate = Update(
250
- id = "2",
251
- name = "Update 2 with very long name that should be truncated",
252
- createdAt = "2022-09-15T19:29:12.244Z",
253
- permalink = ""
329
+ DefaultScreenContainer {
330
+ BranchesScreen(
331
+ isLoading = false,
332
+ needToSignIn = false,
333
+ branches = listOf(
334
+ Branch(
335
+ name = "main",
336
+ compatibleUpdate = Update(
337
+ id = "1",
338
+ name = "Update 1",
339
+ createdAt = "2022-09-15T19:29:12.244Z",
340
+ isCompatible = true,
341
+ permalink = ""
342
+ )
343
+ ),
344
+ Branch(
345
+ name = "develop",
346
+ compatibleUpdate = Update(
347
+ id = "2",
348
+ name = "Update 2 with very long name that should be truncated",
349
+ createdAt = "2022-09-15T19:29:12.244Z",
350
+ permalink = ""
351
+ )
352
+ ),
353
+ Branch(
354
+ name = "staging",
355
+ compatibleUpdate = null
254
356
  )
255
- ),
256
- Branch(
257
- name = "staging",
258
- compatibleUpdate = null
259
357
  )
260
358
  )
261
- )
359
+ }
262
360
  }
@@ -2,9 +2,9 @@ package expo.modules.devlauncher.compose.screens
2
2
 
3
3
  import androidx.compose.foundation.ScrollState
4
4
  import androidx.compose.foundation.horizontalScroll
5
+ import androidx.compose.foundation.layout.Arrangement
5
6
  import androidx.compose.foundation.layout.Box
6
7
  import androidx.compose.foundation.layout.Column
7
- import androidx.compose.foundation.layout.Row
8
8
  import androidx.compose.foundation.layout.padding
9
9
  import androidx.compose.foundation.layout.safeDrawingPadding
10
10
  import androidx.compose.foundation.rememberScrollState
@@ -16,15 +16,16 @@ import androidx.compose.ui.geometry.Offset
16
16
  import androidx.compose.ui.geometry.Size
17
17
  import androidx.compose.ui.graphics.Color
18
18
  import androidx.compose.ui.platform.LocalContext
19
+ import androidx.compose.ui.text.TextStyle
20
+ import androidx.compose.ui.text.font.FontWeight
19
21
  import androidx.compose.ui.tooling.preview.Preview
20
22
  import androidx.compose.ui.unit.Dp
21
23
  import androidx.compose.ui.unit.dp
24
+ import androidx.compose.ui.unit.sp
25
+ import expo.modules.devlauncher.compose.DefaultScreenContainer
22
26
  import expo.modules.devlauncher.compose.ui.ActionButton
23
- import expo.modules.devmenu.compose.primitives.Heading
24
- import expo.modules.devmenu.compose.primitives.Mono
25
- import expo.modules.devmenu.compose.primitives.Spacer
26
- import expo.modules.devmenu.compose.primitives.Text
27
- import expo.modules.devmenu.compose.theme.Theme
27
+ import expo.modules.devmenu.compose.newtheme.NewAppTheme
28
+ import expo.modules.devmenu.compose.primitives.NewText
28
29
  import expo.modules.devmenu.compose.utils.copyToClipboard
29
30
  import org.json.JSONObject
30
31
  import java.text.SimpleDateFormat
@@ -101,11 +102,17 @@ fun StackTrace(
101
102
  Modifier
102
103
  .verticalScroll(verticalScrollState)
103
104
  .horizontalScroll(horizontalScrollState)
105
+
104
106
  ) {
105
- Box(modifier = Modifier.padding(start = Theme.spacing.small, end = Theme.spacing.small, bottom = Theme.spacing.small)) {
106
- Mono(
107
+ Box(modifier = Modifier.padding(horizontal = NewAppTheme.spacing.`4`)) {
108
+ NewText(
107
109
  stack,
108
- fontSize = Theme.typography.size10
110
+ style = TextStyle.Default.merge(
111
+ lineHeight = 16.sp,
112
+ fontSize = 10.sp,
113
+ fontFamily = NewAppTheme.font.mono,
114
+ fontWeight = FontWeight.Light
115
+ )
109
116
  )
110
117
  }
111
118
  }
@@ -120,13 +127,21 @@ fun CrashReportScreen(
120
127
  ) {
121
128
  val context = LocalContext.current
122
129
 
123
- Column(modifier = Modifier.safeDrawingPadding()) {
124
- Spacer(Theme.spacing.medium)
125
-
126
- Row(modifier = Modifier.padding(horizontal = Theme.spacing.small)) {
130
+ Column(
131
+ modifier = Modifier.safeDrawingPadding()
132
+ ) {
133
+ Column(
134
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`4`),
135
+ modifier = Modifier
136
+ .padding(horizontal = NewAppTheme.spacing.`4`)
137
+ .padding(top = NewAppTheme.spacing.`4`)
138
+ ) {
127
139
  ActionButton(
128
140
  "Tap to Copy Report",
129
- style = Theme.colors.button.primary,
141
+ foreground = NewAppTheme.colors.buttons.primary.foreground,
142
+ background = NewAppTheme.colors.buttons.primary.background,
143
+ modifier = Modifier
144
+ .padding(vertical = NewAppTheme.spacing.`2`),
130
145
  onClick = {
131
146
  copyToClipboard(
132
147
  context,
@@ -143,49 +158,63 @@ fun CrashReportScreen(
143
158
  )
144
159
  }
145
160
  )
146
- }
147
161
 
148
- Spacer(Theme.spacing.small)
162
+ Column(verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`1`)) {
163
+ NewText(
164
+ "Occurred:",
165
+ style = NewAppTheme.font.lg.merge(
166
+ fontWeight = FontWeight.Medium
167
+ )
168
+ )
149
169
 
150
- Column(modifier = Modifier.padding(Theme.spacing.small)) {
151
- Heading(
152
- "Occurred:"
153
- )
154
- Spacer(Theme.spacing.tiny)
155
- Text(
156
- SimpleDateFormat.getDateTimeInstance().format(Date(timestamp)).toString()
157
- )
158
- }
170
+ NewText(
171
+ SimpleDateFormat.getDateTimeInstance().format(Date(timestamp)).toString(),
172
+ style = NewAppTheme.font.md,
173
+ color = NewAppTheme.colors.text.secondary
174
+ )
175
+ }
159
176
 
160
- Column(modifier = Modifier.padding(Theme.spacing.small)) {
161
- Heading(
162
- "Reason:"
163
- )
164
- Spacer(Theme.spacing.tiny)
165
- Text(
166
- message
167
- )
168
- }
177
+ Column(verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`1`)) {
178
+ NewText(
179
+ "Reason:",
180
+ style = NewAppTheme.font.lg.merge(
181
+ fontWeight = FontWeight.Medium
182
+ )
183
+ )
169
184
 
170
- Row(modifier = Modifier.padding(Theme.spacing.small)) {
171
- Heading(
172
- "Stack trace:"
173
- )
174
- Spacer(Theme.spacing.tiny)
185
+ NewText(
186
+ message,
187
+ style = NewAppTheme.font.md,
188
+ color = NewAppTheme.colors.text.secondary
189
+ )
190
+ }
175
191
  }
176
192
 
177
- StackTrace(stack)
193
+ Column(
194
+ verticalArrangement = Arrangement.spacedBy(NewAppTheme.spacing.`1`),
195
+ modifier = Modifier.padding(top = NewAppTheme.spacing.`4`)
196
+ ) {
197
+ NewText(
198
+ "Stack Trace:",
199
+ style = NewAppTheme.font.lg.merge(
200
+ fontWeight = FontWeight.Medium
201
+ ),
202
+ modifier = Modifier.padding(horizontal = NewAppTheme.spacing.`4`)
203
+ )
178
204
 
179
- Spacer(Theme.spacing.medium)
205
+ StackTrace(stack)
206
+ }
180
207
  }
181
208
  }
182
209
 
183
210
  @Composable
184
211
  @Preview(showBackground = true)
185
212
  fun CrashReportScreenPreview() {
186
- CrashReportScreen(
187
- timestamp = 1633036800000L,
188
- message = "Sample crash message",
189
- stack = "java.lang.RuntimeException: Sample exception\n\tat com.example.app.MainActivity.onCreate(MainActivity.java:23)\n\tat android.app.Activity.performCreate(Activity.java:8000)\n\tat android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3500)\n\tat android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3600)\n\tat android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:85)\n\tat android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135)\n\tat android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95)\n\tat android.app.ActivityThread.handleMessage(ActivityThread.java:2200)\n\tat android.os.Handler.dispatchMessage(Handler.java:106)\n\tat android.os.Looper.loop(Looper.java:223)\n\tat android.app.ActivityThread.main(ActivityThread.java:7656)\n\tat java.lang.reflect.Method.invoke(Native Method)\n\tat com.android.internal.os.RuntimeInit.run(RuntimeInit.java:592)\n\tat com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)"
190
- )
213
+ DefaultScreenContainer {
214
+ CrashReportScreen(
215
+ timestamp = 1633036800000L,
216
+ message = "Sample crash message",
217
+ stack = "java.lang.RuntimeException: Sample exception\n\tat com.example.app.MainActivity.onCreate(MainActivity.java:23)\n\tat android.app.Activity.performCreate(Activity.java:8000)\n\tat android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3500)\n\tat android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3600)\n\tat android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:85)\n\tat android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135)\n\tat android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95)\n\tat android.app.ActivityThread.handleMessage(ActivityThread.java:2200)\n\tat android.os.Handler.dispatchMessage(Handler.java:106)\n\tat android.os.Looper.loop(Looper.java:223)\n\tat android.app.ActivityThread.main(ActivityThread.java:7656)\n\tat java.lang.reflect.Method.invoke(Native Method)\n\tat com.android.internal.os.RuntimeInit.run(RuntimeInit.java:592)\n\tat com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)"
218
+ )
219
+ }
191
220
  }