Live video on the AT Protocol

relative/formatted timestamps in chat messages and UI controls

+37 -37
+37 -37
js/app/components/chat/chat.tsx
··· 289 289 } 290 290 }} 291 291 > 292 - <View 293 - position="absolute" 294 - flexDirection="row" 295 - right={0} 296 - top="$-3" 297 - alignItems="stretch" 298 - justifyContent="flex-end" 299 - gap="$1" 300 - px="$1" 301 - backgroundColor="rgba(255,255,255,0.5)" 302 - borderRadius="$2" 303 - > 304 - {isWeb && ( 305 - <TouchableOpacity 306 - style={{ 307 - display: hover ? "flex" : "none", 308 - alignItems: "center", 309 - justifyContent: "center", 310 - padding: 4, 311 - }} 312 - onPress={handleReply} 313 - > 292 + {isWeb && ( 293 + <View 294 + position="absolute" 295 + flexDirection="row" 296 + right={0} 297 + top="$-3" 298 + alignItems="center" 299 + justifyContent="center" 300 + gap="$2" 301 + pl="$2" 302 + pr="$1" 303 + backgroundColor="rgba(64,64,64,1)" 304 + borderRadius="$2" 305 + style={{ 306 + display: hover ? "flex" : "none", 307 + alignItems: "center", 308 + justifyContent: "center", 309 + }} 310 + zi={32} 311 + > 312 + <Text fontSize="$2">{timeAgo(message.record.createdAt)}</Text> 313 + <TouchableOpacity onPress={handleReply}> 314 314 <Reply size={16} /> 315 315 </TouchableOpacity> 316 - )} 317 - {isWeb && myStream && ( 318 - <TouchableOpacity 319 - style={{ 320 - display: hover ? "flex" : "none", 321 - alignItems: "center", 322 - justifyContent: "center", 323 - padding: 4, 324 - }} 325 - onPress={moderateMessage} 326 - > 327 - <Settings size={16} /> 328 - </TouchableOpacity> 329 - )} 330 - </View> 316 + {isWeb && myStream && ( 317 + <TouchableOpacity 318 + style={{ 319 + display: hover ? "flex" : "none", 320 + alignItems: "center", 321 + justifyContent: "center", 322 + padding: 4, 323 + }} 324 + onPress={moderateMessage} 325 + > 326 + <Settings size={16} /> 327 + </TouchableOpacity> 328 + )} 329 + </View> 330 + )} 331 331 <ReanimatedSwipeable 332 332 ref={swipeableRef} 333 333 renderRightActions={RightAction}