Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

修复自定义模型与预设模型名重复时,无法正确将自定义模型认定为openai渠道的bug #4748

Closed
wants to merge 11 commits into from
Closed
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 10 additions & 2 deletions app/components/chat.module.scss
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,14 @@
}
}

&[data-expanded="true"] {
width: var(--full-width) !important; /* 始终保持展开状态 */
.text {
opacity: 1;
transform: translate(0);
}
}

.text,
.icon {
display: flex;
Expand Down Expand Up @@ -458,7 +466,7 @@
width: $calc-image-width;
height: $calc-image-width;
}

.chat-message-item-image {
max-width: calc(100vw/3*2);
}
Expand Down Expand Up @@ -624,4 +632,4 @@
.chat-input-send {
bottom: 30px;
}
}
}
68 changes: 38 additions & 30 deletions app/components/chat.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -341,6 +341,7 @@ function ChatAction(props: {
text: string;
icon: JSX.Element;
onClick: () => void;
isExpanded?: boolean;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add keyboard accessibility to the ChatAction component.

The ChatAction component should also respond to keyboard events to ensure accessibility. Consider adding onKeyDown or similar keyboard event handlers.

function ChatAction(props: {
  text: string;
  icon: JSX.Element;
  onClick: () => void;
  isExpanded?: boolean;
}) {
+ onKeyDown={(e) => e.key === 'Enter' && props.onClick()}
  ...
}

Committable suggestion was skipped due to low confidence.

}) {
const iconRef = useRef<HTMLDivElement>(null);
const textRef = useRef<HTMLDivElement>(null);
Expand All @@ -360,6 +361,9 @@ function ChatAction(props: {
});
}

useEffect(() => {
updateWidth();
}, [props.icon, props.text]);
Comment on lines +364 to +366
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ensure updateWidth is included in the dependency array of useEffect.

The updateWidth function is used inside a useEffect but is not included in its dependency array. This might lead to stale closures capturing outdated values.

useEffect(() => {
  updateWidth();
- }, [props.icon, props.text]);
+ }, [props.icon, props.text, updateWidth]);
Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation.

Suggested change
useEffect(() => {
updateWidth();
}, [props.icon, props.text]);
useEffect(() => {
updateWidth();
}, [props.icon, props.text, updateWidth]);
Tools
Biome

[error] 364-364: This hook does not specify all of its dependencies: updateWidth (lint/correctness/useExhaustiveDependencies)

This dependency is not specified in the hook dependency list.


[error] 364-364: This hook specifies more dependencies than necessary: props.icon, props.text (lint/correctness/useExhaustiveDependencies)

This dependency can be removed from the list.

This dependency can be removed from the list.

return (
<div
className={`${styles["chat-input-action"]} clickable`}
Expand All @@ -375,6 +379,7 @@ function ChatAction(props: {
"--full-width": `${width.full}px`,
} as React.CSSProperties
}
data-expanded={props.isExpanded} // 使用 data 属性来控制样式
>
<div ref={iconRef} className={styles["icon"]}>
{props.icon}
Expand Down Expand Up @@ -520,21 +525,21 @@ export function ChatActions(props: {
icon={props.uploading ? <LoadingButtonIcon /> : <ImageIcon />}
/>
)}
<ChatAction
onClick={nextTheme}
text={Locale.Chat.InputActions.Theme[theme]}
icon={
<>
{theme === Theme.Auto ? (
<AutoIcon />
) : theme === Theme.Light ? (
<LightIcon />
) : theme === Theme.Dark ? (
<DarkIcon />
) : null}
</>
}
/>
{/*<ChatAction*/}
{/* onClick={nextTheme}*/}
{/* text={Locale.Chat.InputActions.Theme[theme]}*/}
{/* icon={*/}
{/* <>*/}
{/* {theme === Theme.Auto ? (*/}
{/* <AutoIcon />*/}
{/* ) : theme === Theme.Light ? (*/}
{/* <LightIcon />*/}
{/* ) : theme === Theme.Dark ? (*/}
{/* <DarkIcon />*/}
{/* ) : null}*/}
{/* </>*/}
{/* }*/}
{/*/>*/}

<ChatAction
onClick={props.showPromptHints}
Expand All @@ -551,25 +556,28 @@ export function ChatActions(props: {
/>

<ChatAction
text={Locale.Chat.InputActions.Clear}
icon={<BreakIcon />}
onClick={() => {
chatStore.updateCurrentSession((session) => {
if (session.clearContextIndex === session.messages.length) {
session.clearContextIndex = undefined;
} else {
session.clearContextIndex = session.messages.length;
session.memoryPrompt = ""; // will clear memory
}
});
}}
/>

<ChatAction
isExpanded={true}
onClick={() => setShowModelSelector(true)}
text={currentModel}
icon={<RobotIcon />}
/>
<div style={{ marginLeft: "auto" }}>
<ChatAction
isExpanded={true}
text={Locale.Chat.InputActions.Clear}
icon={<BreakIcon />}
onClick={() => {
chatStore.updateCurrentSession((session) => {
if (session.clearContextIndex === session.messages.length) {
session.clearContextIndex = undefined;
} else {
session.clearContextIndex = session.messages.length;
session.memoryPrompt = ""; // will clear memory
}
});
}}
/>
</div>

{showModelSelector && (
<Selector
Expand Down
2 changes: 1 addition & 1 deletion app/components/sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -158,7 +158,7 @@ export function SideBar(props: { className?: string }) {
NextChat
</div>
<div className={styles["sidebar-sub-title"]}>
Build your own AI assistant.
Build your own AI assistant. (by chenzhen)
</div>
<div className={styles["sidebar-logo"] + " no-dark"}>
<ChatGptIcon />
Expand Down
2 changes: 1 addition & 1 deletion app/constant.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
export const OWNER = "Yidadaa";
export const OWNER = "imaiya";
export const REPO = "ChatGPT-Next-Web";
export const REPO_URL = `https://github.com/${OWNER}/${REPO}`;
export const ISSUE_URL = `https://github.com/${OWNER}/${REPO}/issues`;
Expand Down
4 changes: 2 additions & 2 deletions app/utils/model.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { LLMModel } from "../client/api";

const customProvider = (modelName: string) => ({
id: modelName,
providerName: "",
providerName: "*OpenAI",
providerType: "custom",
});

Expand Down Expand Up @@ -49,7 +49,7 @@ export function collectModelTable(
name,
displayName: displayName || name,
available,
provider: modelTable[name]?.provider ?? customProvider(name), // Use optional chaining
provider: customProvider(name), // Use optional chaining
};
}
});
Expand Down