8000 Sim tweaks for radio. (#915) · nsavas2000/python-editor-v3@945ee0e · GitHub
[go: up one dir, main page]
Skip to content

Commit 945ee0e

Browse files
microbit-matt-hillsdonmicrobit-matt-hillsdon
authored
Sim tweaks for radio. (microbit-foundation#915)
- Fix width. - Fix moving toggle button. - Show placeholder text when radio is off. - Style changes.
1 parent 2b2b949 commit 945ee0e

File tree

4 files changed

+45
-44
lines changed

4 files changed

+45
-44
lines changed

‎src/simulator/AccelerometerModule.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,6 @@ const Gesture = ({ icon, state, onValueChange }: GestureProps) => {
8787
<Select
8888
data-testid="simulator-gesture-select"
8989
aria-label={intl.formatMessage({ id: "simulator-gesture-select" })}
90-
colorScheme="blackAlpha"
9190
value={choice}
9291
onChange={handleSelectChange}
9392
>
@@ -99,7 +98,6 @@ const Gesture = ({ icon, state, onValueChange }: GestureProps) => {
9998
</Select>
10099
<IconButton
101100
icon={<RiSendPlane2Line />}
102-
colorScheme="blackAlpha"
103101
disabled={active}
104102
onClick={handleClick}
105103
aria-label={intl.formatMessage({ id: "simulator-gesture-send" })}

‎src/simulator/RadioModule.tsx

Lines changed: 44 additions & 40 deletions
10000
Original file line numberDiff line numberDiff line change
@@ -47,43 +47,45 @@ const RadioModule = ({ icon, enabled, minimised }: RadioModuleProps) => {
4747
ref.current.scrollTop = ref.current.scrollHeight;
4848
}
4949
}, [scrollToBottom, items]);
50+
if (minimised) {
51+
return (
52+
<HStack spacing={3}>
53+
{icon}
54+
<MessageComposer
55+
enabled={enabled}
56+
onSend={handleSend}
57+
minimised={minimised}
58+
/>
59+
</HStack>
60+
);
61+
}
5062
return (
51-
<HStack pb={minimised ? 0 : 2} pt={0} spacing={3}>
52-
{minimised ? (
53-
<>
54-
{icon}
55-
<MessageComposer
56-
enabled={enabled}
57-
onSend={handleSend}
58-
minimised={minimised}
59-
/>
60-
</>
61-
) : (
62-
<Stack spacing={3} bg="white" borderRadius="md" p={1}>
63-
<Stack spacing={1} p={1}>
64-
<VStack
65-
p={1}
66-
width="100%"
67-
h="2xs"
68-
onScroll={handleScroll}
69-
overflowY="auto"
70-
scrollBehavior="smooth"
71-
ref={ref}
72-
>
73-
{items.map((item) => (
74-
<ChatItem key={item.id} item={item} />
75-
))}
63+
<Stack spacing={3} bg="white" borderRadius="md" p={1}>
64+
<Stack spacing={1} p={1}>
65+
<VStack
66+
p={1}
67+
h="2xs"
68+
onScroll={handleScroll}
69+
overflowY="auto"
70+
scrollBehavior="smooth"
71+
ref={ref}
72+
>
73+
{enabled ? (
74+
items.map((item) => <ChatItem key={item.id} item={item} />)
75+
) : (
76+
<VStack flex="1 1 auto" justifyContent="center">
77+
<ChatNotice>The radio is off</ChatNotice>
7678
</VStack>
77-
<MessageComposer
78-
enabled={enabled}
79-
onSend={handleSend}
80-
minimised={minimised}
81-
width="100%"
82-
/>
83-
</Stack>
84-
</Stack>
85-
)}
86-
</HStack>
79+
)}
80+
</VStack>
81+
<MessageComposer
82+
enabled={enabled}
83+
onSend={handleSend}
84+
minimised={minimised}
85+
width="100%"
86+
/>
87+
</Stack>
88+
</Stack>
8789
);
8890
};
8991

@@ -167,20 +169,22 @@ const MessageComposer = ({
167169
{...props}
168170
>
169171
<Input
172+
colorScheme="brand"
170173
minW={0}
174+
_placeholder={{
175+
color: "gray.600",
176+
}}
171177
borderRadius={minimised ? undefined : "2xl"}
172-
border={minimised ? undefined : "none"}
173-
bgColor={minimised ? "white" : "gray.25"}
174-
aria-label="Radio message to send"
178+
bgColor="white"
179+
aria-label="Radio message"
175180
type="text"
176181
placeholder="Radio message"
177182
value={message}
178183
onChange={(e) => setMessage(e.target.value)}
179184
disabled={!enabled}
180-
></Input>
185+
/>
181186
<IconButton
182187
icon={<RiSendPlane2Line />}
183-
colorScheme="blackAlpha"
184188
disabled={!enabled}
185189
onClick={handleSendMessage}
186190
aria-label={intl.formatMessage({ id: "simulator-radio-send" })}

‎src/simulator/SensorInput.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ const SensorInput = ({
121121
isActive={!!sensor.value}
122122
disabled={disabled}
123123
size="sm"
124-
colorScheme="blackAlpha"
125124
onKeyDown={keyListener}
126125
onKeyUp={keyListener}
127126
onMouseDown={mouseDownListener}
@@ -147,7 +146,6 @@ const SensorInput = ({
147146
transition: "none !important",
148147
},
149148
}}
150-
colorScheme="blackAlpha"
151149
isChecked={isHeld}
152150
onChange={handleOverrideSet}
153151
/>

‎src/simulator/SimulatorModules.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -212,6 +212,7 @@ const CollapsibleModule = ({
212212
)}
213213
{!disclosure.isOpen && <Box w="100%">{module}</Box>}
214214
<IconButton
215+
alignSelf="flex-start"
215216
icon={<ExpandCollapseIcon open={disclosure.isOpen} />}
216217
aria-label={
217218
disclosure.isOpen

0 commit comments

Comments
 (0)
0