-
Group {group.id}
-
{group.members.length} members
+
+
+ {group.members.map((member) => (
+
+ ))}
+
+ {action &&
+ (ownGroup?.usersRole === "OWNER" || ownGroup?.usersRole === "MANAGER") ? (
+
+
+
+ {action === "LIKE"
+ ? t("q:looking.groups.actions.invite")
+ : action === "ACCEPT"
+ ? t("common:actions.accept")
+ : t("q:looking.groups.actions.undo")}
+
+
+ ) : null}
+
+ );
+}
+
+function LFGGroupMemberRow({
+ member,
+ showActions,
+ isOwnGroup,
+}: {
+ member: LFGGroupMember;
+ showActions: boolean;
+ isOwnGroup: boolean;
+}) {
+ const { t } = useTranslation(["q"]);
+ const user = useUser();
+
+ return (
+
+
+
+
+
+ {member.username}
+
+ {member.pronouns ? (
+
+ {member.pronouns.subject}/{member.pronouns.object}
+
+ ) : null}
+
+
+ {showActions || (!showActions && member.role === "OWNER") ? (
+
+ ) : null}
+
+
+
+
+ {member.vc ? (
+
+
+
+ ) : null}
+ {member.plusTier ? (
+
+
+ {member.plusTier}
+
+ ) : null}
+ {member.isStayAsSub ? (
+
+ {t("q:looking.groups.stayAsSub")}
+
+ ) : null}
+
+ {member.weapons && member.weapons.length > 0 ? (
+
+ {member.weapons.map((weapon) => (
+
+ ))}
+
+ ) : null}
+
+ {isOwnGroup ? (
+
+ ) : null}
);
}
+
+function LFGMemberNote({
+ note,
+ editable,
+}: {
+ note: string | null;
+ editable: boolean;
+}) {
+ const { t } = useTranslation(["common", "q"]);
+ const [editing, setEditing] = React.useState(false);
+
+ // biome-ignore lint/correctness/useExhaustiveDependencies(note): when note updates exit editing mode
+ React.useEffect(() => {
+ setEditing(false);
+ }, [note]);
+
+ if (editing) {
+ return
setEditing(false)} />;
+ }
+
+ if (note) {
+ return (
+
+ {note}{" "}
+ {editable ? (
+ setEditing(true)}
+ className="mt-2 ml-auto"
+ >
+ {t("q:looking.groups.editNote")}
+
+ ) : null}
+
+ );
+ }
+
+ if (!editable) return null;
+
+ return (
+ setEditing(true)}
+ >
+ {t("q:looking.groups.addNote")}
+
+ );
+}
+
+function LFGAddNoteForm({
+ note,
+ stopEditing,
+}: {
+ note: string | null;
+ stopEditing: () => void;
+}) {
+ const fetcher = useFetcher();
+ const textareaRef = React.useRef(null);
+ const { t } = useTranslation(["common"]);
+ const [value, setValue] = React.useState(note ?? "");
+
+ const newValueLegal = value.length <= TOURNAMENT_LFG.PUBLIC_NOTE_MAX_LENGTH;
+
+ React.useEffect(() => {
+ if (!textareaRef.current) return;
+ textareaRef.current.focus();
+ textareaRef.current.selectionStart = textareaRef.current.selectionEnd =
+ textareaRef.current.value.length;
+ }, []);
+
+ return (
+
+