Skip to content

Commit bba0857

Browse files
committed
terminal improvments
1 parent a40515f commit bba0857

File tree

6 files changed

+189
-14
lines changed

6 files changed

+189
-14
lines changed
Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
import React from "react";
2+
import { Add, Remove } from "@mui/icons-material";
3+
import { Stack, Box, Slider } from "@mui/material";
4+
import FlatList from "flatlist-react";
5+
import { Toolbar } from "@Components/onsenui/Toolbar";
6+
import { BottomToolbar } from "@Components/onsenui/BottomToolbar";
7+
import { Page } from "@Components/onsenui/Page";
8+
import { BuildConfig } from "@Native/BuildConfig";
9+
import { useActivity } from "@Hooks/useActivity";
10+
import { useTheme } from "@Hooks/useTheme";
11+
import { useNativeStorage } from "@Hooks/useNativeStorage";
12+
import { useSettings } from "@Hooks/useSettings";
13+
import { Ansi } from "@Components/Ansi";
14+
15+
const LogcatActivity = () => {
16+
const [fontSize, setFontSize] = useNativeStorage("mmrlini_log_terminal", 100);
17+
const { context } = useActivity();
18+
const { theme } = useTheme();
19+
const [lines, setLines] = React.useState<string[]>([]);
20+
const { settings } = useSettings();
21+
22+
const termEndRef = React.useRef<HTMLDivElement>(null);
23+
24+
if (settings.term_scroll_bottom) {
25+
const termBehavior = React.useMemo(() => settings.term_scroll_behavior, [settings]);
26+
27+
React.useEffect(() => {
28+
termEndRef.current?.scrollIntoView({ behavior: termBehavior.value, block: "end", inline: "nearest" });
29+
}, [lines]);
30+
}
31+
32+
const addLine = (line: string) => {
33+
setLines((lines) => [...lines, line]);
34+
};
35+
36+
const startLog = () => {
37+
const envp = {
38+
PACKAGENAME: BuildConfig.APPLICATION_ID,
39+
};
40+
41+
Terminal.exec({
42+
command: "logcat --pid=`pidof -s $PACKAGENAME` -v color",
43+
env: envp,
44+
printError: false,
45+
onLine: (line) => {
46+
addLine(line);
47+
},
48+
onExit: (code) => {},
49+
});
50+
};
51+
52+
return (
53+
<Page
54+
onShow={startLog}
55+
renderToolbar={() => (
56+
<Toolbar modifier="noshadow">
57+
<Toolbar.Left>
58+
<Toolbar.BackButton onClick={context.popPage} />
59+
</Toolbar.Left>
60+
<Toolbar.Center>Logcat</Toolbar.Center>
61+
</Toolbar>
62+
)}
63+
modifier="noshadow"
64+
renderBottomToolbar={() => {
65+
return (
66+
<BottomToolbar sx={{ background: "none", backgroundColor: theme.palette.background.default }}>
67+
<Stack spacing={2} direction="row" sx={{ height: "100%", ml: 1, mr: 1 }} alignItems="center">
68+
<Add color="secondary" />
69+
<Slider
70+
value={fontSize}
71+
onChange={(event, newValue) => {
72+
setFontSize(Number(newValue));
73+
}}
74+
step={10}
75+
marks
76+
min={20}
77+
max={200}
78+
/>
79+
<Remove color="secondary" />
80+
</Stack>
81+
</BottomToolbar>
82+
);
83+
}}
84+
>
85+
<div
86+
style={{
87+
display: "flex",
88+
flexWrap: "wrap",
89+
}}
90+
>
91+
<Stack
92+
style={{
93+
whiteSpace: "pre",
94+
flex: "0 0 100%",
95+
color: "white",
96+
height: "100%",
97+
}}
98+
direction="column"
99+
justifyContent="flex-start"
100+
alignItems="stretch"
101+
spacing={0}
102+
>
103+
<FlatList
104+
list={lines}
105+
renderItem={(line, key) => (
106+
<Box
107+
key={key}
108+
component={Ansi}
109+
sx={{
110+
fontSize: fontSize ? `${fontSize}%` : "none",
111+
ml: 1,
112+
mr: 1,
113+
}}
114+
>
115+
{line}
116+
</Box>
117+
)}
118+
renderOnScroll
119+
renderWhenEmpty={() => <></>}
120+
/>
121+
</Stack>
122+
</div>
123+
<div ref={termEndRef} />
124+
</Page>
125+
);
126+
};
127+
128+
export { LogcatActivity };

Website/src/activitys/MainActivity.tsx

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import pkg from "@Package";
2727
import UnverifiedHostActivity from "./UnverifiedHostActivity";
2828
import { useModFS } from "@Hooks/useModFS";
2929
import { SuFile } from "@Native/SuFile";
30+
import { LogcatActivity } from "./LogcatActivity";
3031

3132
const CheckRoot = () => {
3233
if (pkg.config.verified_hosts.includes(location.hostname)) {
@@ -213,7 +214,14 @@ const MainActivity = (): JSX.Element => {
213214
const handleOpenSettings = () => {
214215
pushPage({
215216
component: SettingsActivity,
216-
key: "settings",
217+
key: "SettingsActivity",
218+
});
219+
};
220+
221+
const handleOpenLogcat = () => {
222+
pushPage({
223+
component: LogcatActivity,
224+
key: "LogcatActivity",
217225
});
218226
};
219227

@@ -236,9 +244,14 @@ const MainActivity = (): JSX.Element => {
236244
<Button fullWidth variant="contained" disableElevation onClick={resetErrorBoundary}>
237245
Try again
238246
</Button>
239-
<Button style={{ marginTop: 16 }} fullWidth variant="contained" disableElevation onClick={handleOpenSettings}>
247+
<Button sx={{ mt: 2 }} fullWidth variant="contained" disableElevation onClick={handleOpenSettings}>
240248
Open settings
241249
</Button>
250+
{os.isAndroid && (
251+
<Button sx={{ mt: 2 }} fullWidth variant="contained" disableElevation onClick={handleOpenLogcat}>
252+
Open Logcat
253+
</Button>
254+
)}
242255

243256
<Pre sx={style}>
244257
<Code>{errorInfo.componentStack}</Code>

Website/src/activitys/SettingsActivity.tsx

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -219,9 +219,7 @@ function SettingsActivity() {
219219

220220
<Divider />
221221

222-
<List
223-
subheader={<ListSubheader sx={(theme) => ({ bgcolor: theme.palette.background.default })}>{strings("storage")}</ListSubheader>}
224-
>
222+
<List subheader={<ListSubheader>{strings("storage")}</ListSubheader>}>
225223
<ListItemButton
226224
onClick={() => {
227225
setRepos([]);
@@ -240,6 +238,22 @@ function SettingsActivity() {
240238

241239
<Divider />
242240

241+
{BuildConfig.DEBUG && (
242+
<>
243+
<List subheader={<ListSubheader>Debug</ListSubheader>}>
244+
<ListItemButton
245+
onClick={() => {
246+
throw new Error("Test error thrown!");
247+
}}
248+
>
249+
<ListItemText primary="Throw error" />
250+
</ListItemButton>
251+
</List>
252+
253+
<Divider />
254+
</>
255+
)}
256+
243257
<ListItem>
244258
<ListItemText
245259
primary={

Website/src/activitys/TerminalActivity.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Toolbar } from "@Components/onsenui/Toolbar";
33
import { useActivity } from "@Hooks/useActivity";
44
import { Button, styled } from "@mui/material";
55
import Stack from "@mui/material/Stack";
6+
import Box from "@mui/material/Box";
67
import { Ansi } from "@Components/Ansi";
78
import RestartAltIcon from "@mui/icons-material/RestartAlt";
89
import React from "react";
@@ -307,6 +308,10 @@ const TerminalActivity = () => {
307308
e.callParentHandler();
308309
}
309310
}}
311+
sx={{
312+
// removing bottom window insets
313+
pb: "0px !important",
314+
}}
310315
onShow={install}
311316
modifier="noshadow"
312317
renderToolbar={renderToolbar}
@@ -335,7 +340,7 @@ const TerminalActivity = () => {
335340
))}
336341
</Stack>
337342
</div>
338-
<div ref={termEndRef} />
343+
<Box sx={{ height: view.getWindowBottomInsets() }} ref={termEndRef} />
339344
</Page>
340345
);
341346
};

Website/src/components/module/DeviceModule.tsx

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import Button from "@mui/material/Button";
88

99
import { ModConfActivity } from "@Activitys/ModConfActivity";
1010

11-
import { Delete, Settings, RefreshRounded } from "@mui/icons-material";
11+
import { Delete, Settings, RefreshRounded, Loop } from "@mui/icons-material";
1212

1313
import { useTheme } from "@Hooks/useTheme";
1414
import { useSettings } from "@Hooks/useSettings";
@@ -44,6 +44,7 @@ const DeviceModule = React.memo<Props>((props) => {
4444

4545
const remove = new SuFile(format("REMOVE"));
4646
const disable = new SuFile(format("DISABLE"));
47+
const has_update = SuFile.exist(format("UPDATE"));
4748

4849
const [isEnabled, setIsEnabled] = React.useState(!disable.exist());
4950
const [isSwitchDisabled, setIsSwitchDisabled] = React.useState(remove.exist());
@@ -59,8 +60,8 @@ const DeviceModule = React.memo<Props>((props) => {
5960
const module_config_file = SuFile.exist(format("CONFINDEX"));
6061

6162
return (
62-
<Card sx={{ p: 2, width: "100%" }}>
63-
<Stack direction="column" justifyContent="center" spacing={1}>
63+
<Card sx={{ position: "relative", p: 2, width: "100%" }}>
64+
<Stack sx={{ position: "relative", zIndex: 1 }} direction="column" justifyContent="center" spacing={1}>
6465
{cover && (
6566
<Image
6667
sx={(theme) => ({
@@ -113,7 +114,7 @@ const DeviceModule = React.memo<Props>((props) => {
113114
<Typography variant="caption" display="block">
114115
<Switch
115116
checked={isEnabled}
116-
disabled={isSwitchDisabled}
117+
disabled={isSwitchDisabled || has_update}
117118
onChange={(e) => {
118119
const checked = e.target.checked;
119120

@@ -228,6 +229,20 @@ const DeviceModule = React.memo<Props>((props) => {
228229
</Stack>
229230
</Stack>
230231
</Stack>
232+
{has_update && (
233+
<Loop
234+
sx={{
235+
position: "absolute",
236+
left: "50%",
237+
top: "50%",
238+
fill: theme.palette.background.default,
239+
color: theme.palette.background.default,
240+
WebkitTransform: "translate(-50%, -50%)",
241+
transform: "translate(-50%, -50%)",
242+
fontSize: "50cqmin",
243+
}}
244+
/>
245+
)}
231246
</Card>
232247
);
233248
});

Website/src/components/onsenui/Page.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,10 @@ interface HTMLPage {
2424
renderToolbar?: RenderFunction;
2525
renderBottomToolbar?: RenderFunction;
2626
renderFixed?: RenderFunction;
27-
onInit?: Function;
28-
onShow?: Function;
29-
onHide?: Function;
30-
onInfiniteScroll?: Function;
27+
onInit?: void | Function;
28+
onShow?: void | Function;
29+
onHide?: void | Function;
30+
onInfiniteScroll?: () => void;
3131
onDeviceBackButton?: (event: DeviceBackButtonEvent) => void;
3232
children?: React.ReactNode;
3333
statusbarColor?: string;

0 commit comments

Comments
 (0)