mirror of
https://github.com/wassname/Open-Assistant.git
synced 2026-06-27 16:10:30 +08:00
wip
This commit is contained in:
Generated
+15
@@ -32,6 +32,7 @@
|
||||
"focus-visible": "^5.2.0",
|
||||
"framer-motion": "^6.5.1",
|
||||
"install": "^0.13.0",
|
||||
"lucide-react": "^0.105.0",
|
||||
"next": "13.0.6",
|
||||
"next-auth": "^4.18.6",
|
||||
"next-i18next": "^13.0.3",
|
||||
@@ -26694,6 +26695,14 @@
|
||||
"yallist": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/lucide-react": {
|
||||
"version": "0.105.0",
|
||||
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.105.0.tgz",
|
||||
"integrity": "sha512-iHaIkd4Wq6aNIVrFMXt3If8E/+2lnJd4WlCyntoJNIzZ8nWhdSSHWpsw7XM4rlw2319LZ2t4WLdnM8Z0ECDTOQ==",
|
||||
"peerDependencies": {
|
||||
"react": "^16.5.1 || ^17.0.0 || ^18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/lz-string": {
|
||||
"version": "1.4.4",
|
||||
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
|
||||
@@ -57869,6 +57878,12 @@
|
||||
"yallist": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"lucide-react": {
|
||||
"version": "0.105.0",
|
||||
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.105.0.tgz",
|
||||
"integrity": "sha512-iHaIkd4Wq6aNIVrFMXt3If8E/+2lnJd4WlCyntoJNIzZ8nWhdSSHWpsw7XM4rlw2319LZ2t4WLdnM8Z0ECDTOQ==",
|
||||
"requires": {}
|
||||
},
|
||||
"lz-string": {
|
||||
"version": "1.4.4",
|
||||
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
|
||||
|
||||
@@ -49,6 +49,7 @@
|
||||
"focus-visible": "^5.2.0",
|
||||
"framer-motion": "^6.5.1",
|
||||
"install": "^0.13.0",
|
||||
"lucide-react": "^0.105.0",
|
||||
"next": "13.0.6",
|
||||
"next-auth": "^4.18.6",
|
||||
"next-i18next": "^13.0.3",
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import { Box, Link, Text, useColorMode } from "@chakra-ui/react";
|
||||
import { Github } from "lucide-react";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { useId } from "react";
|
||||
import { FaDiscord, FaGithub } from "react-icons/fa";
|
||||
import { FaDiscord } from "react-icons/fa";
|
||||
|
||||
import { Container } from "./Container";
|
||||
|
||||
@@ -81,7 +82,7 @@ export function CallToAction() {
|
||||
type="button"
|
||||
className="mb-2 ml-6 flex items-center rounded-md border border-transparent bg-blue-600 px-6 py-3 text-base font-medium text-white shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
|
||||
>
|
||||
<FaGithub size={25} />
|
||||
<Github size={25} />
|
||||
<Text as="span" className="text-lg ml-3">
|
||||
{t("github")}
|
||||
</Text>
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import { Box, Link, Text, useColorModeValue } from "@chakra-ui/react";
|
||||
import { AlertTriangle, LucideIcon } from "lucide-react";
|
||||
import { useRouter } from "next/router";
|
||||
import { FiAlertTriangle } from "react-icons/fi";
|
||||
import { IconType } from "react-icons/lib";
|
||||
|
||||
type EmptyStateProps = {
|
||||
text: string;
|
||||
icon: IconType;
|
||||
icon: LucideIcon;
|
||||
};
|
||||
|
||||
export const EmptyState = (props: EmptyStateProps) => {
|
||||
@@ -26,5 +25,5 @@ export const EmptyState = (props: EmptyStateProps) => {
|
||||
};
|
||||
|
||||
export const TaskEmptyState = () => {
|
||||
return <EmptyState text="Looks like no tasks were found." icon={FiAlertTriangle} />;
|
||||
return <EmptyState text="Looks like no tasks were found." icon={AlertTriangle} />;
|
||||
};
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
import { Box, Button, Flex, Text } from "@chakra-ui/react";
|
||||
import { User } from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { useSession } from "next-auth/react";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { Flags } from "react-feature-flags";
|
||||
import { FaUser } from "react-icons/fa";
|
||||
import { LanguageSelector } from "src/components/LanguageSelector";
|
||||
|
||||
import { UserMenu } from "./UserMenu";
|
||||
@@ -17,7 +17,7 @@ function AccountButton() {
|
||||
return (
|
||||
<Link href="/auth/signin" aria-label="Home">
|
||||
<Flex alignItems="center">
|
||||
<Button variant="outline" leftIcon={<FaUser />}>
|
||||
<Button variant="outline" leftIcon={<User size={"20"} />}>
|
||||
Sign in
|
||||
</Button>
|
||||
</Flex>
|
||||
|
||||
@@ -11,11 +11,11 @@ import {
|
||||
Text,
|
||||
useColorModeValue,
|
||||
} from "@chakra-ui/react";
|
||||
import { AlertTriangle, Layout, LogOut, Settings, Shield } from "lucide-react";
|
||||
import NextLink from "next/link";
|
||||
import { signOut, useSession } from "next-auth/react";
|
||||
import { useTranslation } from "next-i18next";
|
||||
import React, { ElementType, useCallback } from "react";
|
||||
import { FiAlertTriangle, FiLayout, FiLogOut, FiSettings, FiShield } from "react-icons/fi";
|
||||
|
||||
interface MenuOption {
|
||||
name: string;
|
||||
@@ -41,21 +41,21 @@ export function UserMenu() {
|
||||
name: t("dashboard"),
|
||||
href: "/dashboard",
|
||||
desc: t("dashboard"),
|
||||
icon: FiLayout,
|
||||
icon: Layout,
|
||||
isExternal: false,
|
||||
},
|
||||
{
|
||||
name: t("account_settings"),
|
||||
href: "/account",
|
||||
desc: t("account_settings"),
|
||||
icon: FiSettings,
|
||||
icon: Settings,
|
||||
isExternal: false,
|
||||
},
|
||||
{
|
||||
name: t("report_a_bug"),
|
||||
href: "https://github.com/LAION-AI/Open-Assistant/issues/new/choose",
|
||||
desc: t("report_a_bug"),
|
||||
icon: FiAlertTriangle,
|
||||
icon: AlertTriangle,
|
||||
isExternal: true,
|
||||
},
|
||||
];
|
||||
@@ -65,7 +65,7 @@ export function UserMenu() {
|
||||
name: t("admin_dashboard"),
|
||||
href: "/admin",
|
||||
desc: t("admin_dashboard"),
|
||||
icon: FiShield,
|
||||
icon: Shield,
|
||||
isExternal: false,
|
||||
});
|
||||
}
|
||||
@@ -98,7 +98,7 @@ export function UserMenu() {
|
||||
_hover={{ textDecoration: "none" }}
|
||||
>
|
||||
<MenuItem gap="3" borderRadius="md" p="4">
|
||||
<item.icon className="text-blue-500" aria-hidden="true" />
|
||||
<item.icon size="1em" className="text-blue-500" aria-hidden="true" />
|
||||
<Text>{item.name}</Text>
|
||||
</MenuItem>
|
||||
</Link>
|
||||
@@ -106,7 +106,7 @@ export function UserMenu() {
|
||||
</MenuGroup>
|
||||
<MenuDivider />
|
||||
<MenuItem gap="3" borderRadius="md" p="4" onClick={handleSignOut}>
|
||||
<FiLogOut className="text-blue-500" aria-hidden="true" />
|
||||
<LogOut size="1em" className="text-blue-500" aria-hidden="true" />
|
||||
<Text>{t("sign_out")}</Text>
|
||||
</MenuItem>
|
||||
</MenuList>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
// https://nextjs.org/docs/basic-features/layouts
|
||||
|
||||
import { Box, Grid } from "@chakra-ui/react";
|
||||
import { Activity, BarChart2, Layout, MessageSquare, Users } from "lucide-react";
|
||||
import type { NextPage } from "next";
|
||||
import { FiBarChart2, FiLayout, FiMessageSquare, FiUsers, FiActivity } from "react-icons/fi";
|
||||
import { Header } from "src/components/Header";
|
||||
|
||||
import { SlimFooter } from "./Dashboard/SlimFooter";
|
||||
@@ -38,19 +38,19 @@ export const getDashboardLayout = (page: React.ReactElement) => (
|
||||
label: "Dashboard",
|
||||
pathname: "/dashboard",
|
||||
desc: "Dashboard Home",
|
||||
icon: FiLayout,
|
||||
icon: Layout,
|
||||
},
|
||||
{
|
||||
label: "Messages",
|
||||
pathname: "/messages",
|
||||
desc: "Messages Dashboard",
|
||||
icon: FiMessageSquare,
|
||||
icon: MessageSquare,
|
||||
},
|
||||
{
|
||||
label: "Leaderboard",
|
||||
pathname: "/leaderboard",
|
||||
desc: "User Leaderboard",
|
||||
icon: FiBarChart2,
|
||||
icon: BarChart2,
|
||||
},
|
||||
]}
|
||||
>
|
||||
@@ -73,13 +73,13 @@ export const getAdminLayout = (page: React.ReactElement) => (
|
||||
label: "Users",
|
||||
pathname: "/admin",
|
||||
desc: "Users Dashboard",
|
||||
icon: FiUsers,
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
label: "Status",
|
||||
pathname: "/admin/status",
|
||||
desc: "Status Dashboard",
|
||||
icon: FiActivity,
|
||||
icon: Activity,
|
||||
},
|
||||
]}
|
||||
>
|
||||
|
||||
@@ -1,15 +1,14 @@
|
||||
import { Box, Button, Text, Tooltip, useColorMode } from "@chakra-ui/react";
|
||||
import { LucideIcon, Sun } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import { FiSun } from "react-icons/fi";
|
||||
import { IconType } from "react-icons/lib";
|
||||
import { colors } from "styles/Theme/colors";
|
||||
|
||||
export interface MenuButtonOption {
|
||||
label: string;
|
||||
pathname: string;
|
||||
desc: string;
|
||||
icon: IconType;
|
||||
icon: LucideIcon;
|
||||
}
|
||||
|
||||
export interface SideMenuProps {
|
||||
@@ -47,7 +46,7 @@ export function SideMenu(props: SideMenuProps) {
|
||||
bg={router.pathname === item.pathname ? "blue.500" : null}
|
||||
_hover={router.pathname === item.pathname ? { bg: "blue.600" } : null}
|
||||
>
|
||||
<item.icon className={router.pathname === item.pathname ? "text-blue-200" : null} />
|
||||
<item.icon size={"1em"} className={router.pathname === item.pathname ? "text-blue-200" : null} />
|
||||
<Text
|
||||
fontWeight="normal"
|
||||
color={router.pathname === item.pathname ? "white" : null}
|
||||
@@ -63,7 +62,7 @@ export function SideMenu(props: SideMenuProps) {
|
||||
<div>
|
||||
<Tooltip fontFamily="inter" label="Toggle Dark Mode" placement="right" className="hidden lg:hidden sm:block">
|
||||
<Button size="lg" width="full" justifyContent="center" onClick={toggleColorMode} gap="2">
|
||||
<FiSun />
|
||||
<Sun size={"1em"} />
|
||||
<Text fontWeight="normal" className="hidden lg:block">
|
||||
{colorMode === "light" ? "Dark Mode" : "Light Mode"}
|
||||
</Text>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { Box, useColorModeValue } from "@chakra-ui/react";
|
||||
import { useSortable } from "@dnd-kit/sortable";
|
||||
import { CSS } from "@dnd-kit/utilities";
|
||||
import { GripVertical } from "lucide-react";
|
||||
import { PropsWithChildren, useState } from "react";
|
||||
import { RxDragHandleDots2 } from "react-icons/rx";
|
||||
|
||||
export const SortableItem = ({
|
||||
children,
|
||||
@@ -45,7 +45,7 @@ export const SortableItem = ({
|
||||
style={style}
|
||||
shadow="base"
|
||||
>
|
||||
<Box pr="4">{isEditable ? <RxDragHandleDots2 size="20px" /> : `${index + 1}.`}</Box>
|
||||
<Box pr="4">{isEditable ? <GripVertical size="20px" /> : `${index + 1}.`}</Box>
|
||||
{children}
|
||||
</Box>
|
||||
);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { Box, Flex, IconButton, Tooltip, useColorModeValue } from "@chakra-ui/react";
|
||||
import { FiEdit2 } from "react-icons/fi";
|
||||
import { Edit2 } from "lucide-react";
|
||||
import { SkipButton } from "src/components/Buttons/Skip";
|
||||
import { SubmitButton } from "src/components/Buttons/Submit";
|
||||
import { TaskInfo } from "src/components/TaskInfo/TaskInfo";
|
||||
@@ -36,7 +36,13 @@ export const TaskControls = (props: TaskControlsProps) => {
|
||||
{props.taskStatus === "REVIEW" || props.taskStatus === "SUBMITTED" ? (
|
||||
<>
|
||||
<Tooltip label="Edit">
|
||||
<IconButton size="lg" data-cy="edit" aria-label="edit" onClick={props.onEdit} icon={<FiEdit2 />} />
|
||||
<IconButton
|
||||
size="lg"
|
||||
data-cy="edit"
|
||||
aria-label="edit"
|
||||
onClick={props.onEdit}
|
||||
icon={<Edit2 size="1em" />}
|
||||
/>
|
||||
</Tooltip>
|
||||
<SubmitButton
|
||||
colorScheme="green"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { HStack, IconButton, Link, Stack, Text, useColorModeValue } from "@chakra-ui/react";
|
||||
import { FiHelpCircle } from "react-icons/fi";
|
||||
import { HelpCircle } from "lucide-react";
|
||||
import type { TaskInfo } from "src/components/Tasks/TaskTypes";
|
||||
|
||||
interface TaskHeaderProps {
|
||||
@@ -22,7 +22,7 @@ const TaskHeader = ({ taskType }: TaskHeaderProps) => {
|
||||
{taskType.label}
|
||||
</Text>
|
||||
<Link href={taskType.help_link} isExternal>
|
||||
<IconButton variant="ghost" aria-label="More Information" icon={<FiHelpCircle />} />
|
||||
<IconButton variant="ghost" aria-label="More Information" icon={<HelpCircle size="1em" />} />
|
||||
</Link>
|
||||
</HStack>
|
||||
<Text fontSize="md" color={labelColor}>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { Box, Button, Center, Link, Text } from "@chakra-ui/react";
|
||||
import { AlertTriangle } from "lucide-react";
|
||||
import Head from "next/head";
|
||||
import { FiAlertTriangle } from "react-icons/fi";
|
||||
import { EmptyState } from "src/components/EmptyState";
|
||||
import { getTransparentHeaderLayout } from "src/components/Layout";
|
||||
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
|
||||
@@ -13,12 +13,12 @@ function Error() {
|
||||
<meta name="404" content="Sorry, this page doesn't exist." />
|
||||
</Head>
|
||||
<Center flexDirection="column" gap="4" fontSize="lg" className="subpixel-antialiased">
|
||||
<EmptyState text="Sorry, the page you are looking for does not exist." icon={FiAlertTriangle} />
|
||||
<EmptyState text="Sorry, the page you are looking for does not exist." icon={AlertTriangle} />
|
||||
<Box display="flex" flexDirection="column" alignItems="center" gap="2" mt="6">
|
||||
<Text fontSize="sm">If you were trying to contribute data but ended up here, please file a bug.</Text>
|
||||
<Button
|
||||
width="fit-content"
|
||||
leftIcon={<FiAlertTriangle className="text-blue-500" aria-hidden="true" />}
|
||||
leftIcon={<AlertTriangle size={"1em"} className="text-blue-500" aria-hidden="true" />}
|
||||
variant="solid"
|
||||
size="xs"
|
||||
>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { Box, Button, Center, Link, Text } from "@chakra-ui/react";
|
||||
import { AlertTriangle } from "lucide-react";
|
||||
import Head from "next/head";
|
||||
import { FiAlertTriangle } from "react-icons/fi";
|
||||
import { EmptyState } from "src/components/EmptyState";
|
||||
import { getTransparentHeaderLayout } from "src/components/Layout";
|
||||
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
|
||||
@@ -13,15 +13,12 @@ function ServerError() {
|
||||
<meta name="404" content="Sorry, this page doesn't exist." />
|
||||
</Head>
|
||||
<Center flexDirection="column" gap="4" fontSize="lg" className="subpixel-antialiased">
|
||||
<EmptyState
|
||||
text="Sorry, we encountered a server error. We're not sure what went wrong."
|
||||
icon={FiAlertTriangle}
|
||||
/>
|
||||
<EmptyState text="Sorry, we encountered a server error. We're not sure what went wrong." icon={AlertTriangle} />
|
||||
<Box display="flex" flexDirection="column" alignItems="center" gap="2" mt="6">
|
||||
<Text fontSize="sm">If you were trying to contribute data but ended up here, please file a bug.</Text>
|
||||
<Button
|
||||
width="fit-content"
|
||||
leftIcon={<FiAlertTriangle className="text-blue-500" aria-hidden="true" />}
|
||||
leftIcon={<AlertTriangle size="1em" className="text-blue-500" aria-hidden="true" />}
|
||||
variant="solid"
|
||||
size="xs"
|
||||
>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
import { Button, Divider, Flex, Grid, Icon, Text } from "@chakra-ui/react";
|
||||
import { Divider, Flex, Grid, Icon, Text } from "@chakra-ui/react";
|
||||
import Head from "next/head";
|
||||
import Link from "next/link";
|
||||
import { useSession } from "next-auth/react";
|
||||
import React from "react";
|
||||
export { getDefaultStaticProps as getStaticProps } from "src/lib/default_static_props";
|
||||
import { MdOutlineEdit } from "react-icons/md";
|
||||
import { Pencil } from "lucide-react";
|
||||
import { SurveyCard } from "src/components/Survey/SurveyCard";
|
||||
|
||||
export default function Account() {
|
||||
@@ -34,7 +34,7 @@ export default function Account() {
|
||||
<Flex gap={2}>
|
||||
{session.user.name ?? "(No username)"}
|
||||
<Link href="/account/edit">
|
||||
<Icon boxSize={5} as={MdOutlineEdit} />
|
||||
<Icon boxSize={5} as={Pencil} size="1em" />
|
||||
</Link>
|
||||
</Flex>
|
||||
<Text as="b">Email</Text>
|
||||
|
||||
Reference in New Issue
Block a user