Skip to content

Commit

Permalink
Solved error messages, bug on slider remains
Browse files Browse the repository at this point in the history
  • Loading branch information
@Stronkness
Stronkness committed Sep 26, 2024
1 parent 5dbc5df commit 419534b
Show file tree
Hide file tree
Showing 2 changed files with 144 additions and 161 deletions.
232 changes: 116 additions & 116 deletions components/eventList/EventList.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,131 +186,131 @@ export function EventList({ events, onPress, showTickets }: EventListProps) {
</View>
<View style={styles.unregisterBox}>
<Pressable onPress={handleCrossPress}>
<Entypo name="cross" size={height * 0.08} color="black" />{" "}
<Entypo name="cross" size={height * 0.08} color="black" />
</Pressable>
</View>

<RBSheet
ref={(ref) => (refRBSheet.current[1] = ref)}
useNativeDriver={true}
height={height * 0.6}
customStyles={{
draggableIcon: {
backgroundColor: "transparent",
},
container: {
backgroundColor: Colors.arkadNavy,
},
}}
customModalProps={{
animationType: "fade",
statusBarTranslucent: false,
}}
customAvoidingViewProps={{
enabled: false,
}}
>
<View style={styles.centeredView}>
<View style={styles.qrModalContainer}>
<QRCode
size={Dimensions.get("window").width * 0.65}
value={chosenTicket?.code}
/>
</View>

<ArkadText
style={{ fontSize: 25, paddingTop: "2%" }}
text={`${event.name}`}
/>
<ArkadText
style={{ fontSize: 15, fontStyle: "italic" }}
text={`Ticket ID: ${chosenTicket?.code}`}
<RBSheet
ref={(ref) => (refRBSheet.current[1] = ref)}
useNativeDriver={true}
height={height * 0.6}
customStyles={{
draggableIcon: {
backgroundColor: "transparent",
},
container: {
backgroundColor: Colors.arkadNavy,
},
}}
customModalProps={{
animationType: "fade",
statusBarTranslucent: false,
}}
customAvoidingViewProps={{
enabled: false,
}}
>
<View style={styles.centeredView}>
<View style={styles.qrModalContainer}>
<QRCode
size={Dimensions.get("window").width * 0.65}
value={chosenTicket?.code}
/>
<ArkadButton
onPress={() => {
refRBSheet.current[1]?.close();
selectedTicket(null);
}}
style={{
width: "75%",
backgroundColor: Colors.arkadTurkos,
paddingBottom: "2%",
}}
>
<ArkadText text="Close" />
</ArkadButton>
</View>
</RBSheet>

<RBSheet
ref={(ref) => (refRBSheet.current[0] = ref)}
useNativeDriver={true}
height={height * 0.3}
customStyles={{
draggableIcon: {
backgroundColor: "transparent",
},
container: {
backgroundColor: Colors.arkadNavy,
},
}}
customModalProps={{
animationType: "fade",
statusBarTranslucent: false,
}}
customAvoidingViewProps={{
enabled: false,
}}
>
<View>
<ArkadText
style={{
color: Colors.white,
fontSize: 25,
fontFamily: "main-font-bold",
marginTop: "10%",
}}
text={`Do you want to unregister from ${event.name}?`}
/>
<View
style={{
flexDirection: "row",
justifyContent: "space-between",
width: "90%",
alignSelf: "center",
}}
>
{isYesButtonDisabled && (
<ArkadButton
onPress={() => null}
style={{
backgroundColor: Colors.gray,
width: "45%",
}}
>
<ArkadText text="Yes" />
</ArkadButton>
)}
{!isYesButtonDisabled && (
<ArkadButton
onPress={() => deregister(event)}
style={{
backgroundColor: Colors.arkadTurkos,
width: "45%",
}}
>
<ArkadText text="Yes" />
</ArkadButton>
)}
<ArkadText
style={{ fontSize: 25, paddingTop: "2%" }}
text={`${event.name}`}
/>
<ArkadText
style={{ fontSize: 15, fontStyle: "italic" }}
text={`Ticket ID: ${chosenTicket?.code}`}
/>
<ArkadButton
onPress={() => {
refRBSheet.current[1]?.close();
selectedTicket(null);
}}
style={{
width: "75%",
backgroundColor: Colors.arkadTurkos,
paddingBottom: "2%",
}}
>
<ArkadText text="Close" />
</ArkadButton>
</View>
</RBSheet>

<RBSheet
ref={(ref) => (refRBSheet.current[0] = ref)}
useNativeDriver={true}
height={height * 0.3}
customStyles={{
draggableIcon: {
backgroundColor: "transparent",
},
container: {
backgroundColor: Colors.arkadNavy,
},
}}
customModalProps={{
animationType: "fade",
statusBarTranslucent: false,
}}
customAvoidingViewProps={{
enabled: false,
}}
>
<View>
<ArkadText
style={{
color: Colors.white,
fontSize: 25,
fontFamily: "main-font-bold",
marginTop: "10%",
}}
text={`Do you want to unregister from ${event.name}?`}
/>
<View
style={{
flexDirection: "row",
justifyContent: "space-between",
width: "90%",
alignSelf: "center",
}}
>
{isYesButtonDisabled && (
<ArkadButton
onPress={() => refRBSheet.current[0]?.close()}
style={{ width: "45%" }}
onPress={() => null}
style={{
backgroundColor: Colors.gray,
width: "45%",
}}
>
<ArkadText text="Close" />
<ArkadText text="Yes" />
</ArkadButton>
</View>
)}
{!isYesButtonDisabled && (
<ArkadButton
onPress={() => deregister(event)}
style={{
backgroundColor: Colors.arkadTurkos,
width: "45%",
}}
>
<ArkadText text="Yes" />
</ArkadButton>
)}
<ArkadButton
onPress={() => refRBSheet.current[0]?.close()}
style={{ width: "45%" }}
>
<ArkadText text="Close" />
</ArkadButton>
</View>
</RBSheet>
</View>
</View>
</RBSheet>
</View>
)}
</View>
Expand Down
73 changes: 28 additions & 45 deletions screens/event/EventListScreen.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import { useCallback } from "react";
import Toast from "react-native-toast-message";
import Colors from "constants/Colors";
import { TicketType } from "api/Tickets";
import { ArkadText } from "components/StyledText";

const { width } = Dimensions.get("window");

Expand All @@ -37,7 +38,6 @@ export default function EventListScreen({ navigation }: EventsNavigation) {
null
);
const [showAllEvents, setShowAllEvents] = React.useState<boolean>(true);
const [showAllTickets, setShowAllTickets] = React.useState<boolean>(false);
const [QRMode, setQRMode] = React.useState<boolean>(true);
const [eventTickets, setEventTickets] = React.useState<Event[] | null>(null);
const [auth, setAuth] = React.useState<boolean>(false);
Expand Down Expand Up @@ -81,16 +81,6 @@ export default function EventListScreen({ navigation }: EventsNavigation) {
setLoading(false);
};

function switchEvents() {
setShowAllEvents(true);
setShowAllTickets(false);
}

function switchTickets() {
setShowAllEvents(false);
setShowAllTickets(true);
}

function switchQRMode() {
setQRMode(!QRMode);
}
Expand Down Expand Up @@ -126,26 +116,20 @@ export default function EventListScreen({ navigation }: EventsNavigation) {
return <ScreenActivityIndicator />;
}

const TwoButtonSlider = ({
onEventsPress,
onTicketsPress,
}: {
onEventsPress: () => void;
onTicketsPress: () => void;
}) => {
const TwoButtonSlider = () => {
const [active, setActive] = React.useState("Events");
const translateX = useSharedValue(0);

const switchToEvents = () => {
setActive("Events");
translateX.value = withTiming(0, { duration: 250 }, () => {});
onEventsPress();
};

const switchToTickets = () => {
setActive("Your Tickets");
translateX.value = withTiming(width * 0.38, { duration: 250 }, () => {});
onTicketsPress();
const switchTab = (tab: React.SetStateAction<string>) => {
console.count("switchTab");
if (tab === "Events") {
setShowAllEvents(true);
translateX.value = withTiming(0, { duration: 250 });
} else {
setShowAllEvents(false);
translateX.value = withTiming(width * 0.38, { duration: 250 });
}
setActive(tab);
};

const animatedStyle = useAnimatedStyle(() => {

Check failure on line 135 in screens/event/EventListScreen.tsx

View workflow job for this annotation

GitHub Actions / test 

Argument of type '() => { transform: { translateX: number; }[]; }' is not assignable to parameter of type '() => AnimatedStyleProp<ViewStyle | TextStyle | ImageStyle>'.
Expand All @@ -156,25 +140,29 @@ export default function EventListScreen({ navigation }: EventsNavigation) {

return (
<View style={styles.buttonsContainer}>
<TouchableOpacity style={styles.button} onPress={switchToEvents}>
<Text
<TouchableOpacity
style={styles.button}
onPress={() => switchTab("Events")}
>
<ArkadText
style={
active === "Events" ? styles.activeText : styles.inactiveText
}
>
Events
</Text>
text="Events"
/>
</TouchableOpacity>
<TouchableOpacity style={styles.button} onPress={switchToTickets}>
<Text
<TouchableOpacity
style={styles.button}
onPress={() => switchTab("Your Tickets")}
>
<ArkadText
style={
active === "Your Tickets"
? styles.activeText
: styles.inactiveText
}
>
Your Tickets
</Text>
text="Your Tickets"
/>
</TouchableOpacity>
<Animated.View style={[styles.slider, animatedStyle]} />
</View>
Expand All @@ -183,13 +171,8 @@ export default function EventListScreen({ navigation }: EventsNavigation) {

return (
<View style={styles.container}>
{auth && <TwoButtonSlider />}
<View style={styles.container}>
{auth && (
<TwoButtonSlider
onEventsPress={switchEvents}
onTicketsPress={switchTickets}
/>
)}
{/* <UpcomingButton showAllEvents={showAllEvents} onPress={switchEvents} /> */}
{/* Admin button for QR Mode */}
{role === Role.Administrator && (
Expand All @@ -199,7 +182,7 @@ export default function EventListScreen({ navigation }: EventsNavigation) {
<EventList
events={showAllEvents ? events : eventTickets}
onPress={openEventDetails}
showTickets={showAllTickets}
showTickets={!showAllEvents}
/>
</View>
</View>
Expand Down

0 comments on commit 419534b

Please sign in to comment.