Skip to content

[pull] main from supermemoryai:main #332

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.

Sign up for GitHub

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

Merged
pull merged 2 commits into from
May 25, 2026
Merged

[pull] main from supermemoryai:main #332

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ed0584e
fix responsiveness in settings (#1001)
ishaanxgupta May 25, 2026
fdecae7
fix(web): prevent multi-file upload queue rows from being clipped (#1…
MaheshtheDev May 25, 2026
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
4 changes: 2 additions & 2 deletions apps/web/components/add-document/file.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -242,12 +242,12 @@ export function FileContent({
{hasItems ? (
<ul
id="file-upload-queue"
className="flex flex-col gap-2 max-h-[220px] overflow-y-auto scrollbar-thin pr-1"
className="flex flex-col gap-2 max-h-[360px] overflow-y-auto scrollbar-thin pr-1"
>
{data.items.map((item) => (
<li
key={item.id}
className="relative overflow-hidden rounded-[12px] bg-[#14161A] shadow-inside-out text-sm"
className="relative shrink-0 overflow-hidden rounded-[12px] bg-[#14161A] shadow-inside-out text-sm"
>
{item.status === "uploading" ? (
<div
Expand Down
22 changes: 12 additions & 10 deletions apps/web/components/bottom-nav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {
Home,
LayoutGrid,
Plus,
MessageCircleIcon,
MoreHorizontal,
SearchIcon,
Sun,
Expand All @@ -25,6 +24,7 @@ import {
} from "@ui/components/dropdown-menu"
import { useViewMode, type ViewMode } from "@/lib/view-mode-context"
import { feedbackParam } from "@/lib/search-params"
import NovaOrb from "@/components/nova/nova-orb"

const INTEGRATION_VIEWS: ViewMode[] = [
"integrations",
Expand All @@ -49,7 +49,6 @@ export function MobileBottomNav({ onAddMemory, onOpenSearch }: BottomNavProps) {

const isHome = viewMode === "dashboard"
const isMemories = viewMode === "list" || viewMode === "graph"
const isChat = viewMode === "chat"
const isMore = INTEGRATION_VIEWS.includes(viewMode)

return (
Expand All @@ -75,17 +74,20 @@ export function MobileBottomNav({ onAddMemory, onOpenSearch }: BottomNavProps) {
/>
<button
type="button"
aria-label="Add memory"
onClick={onAddMemory}
className="flex size-11 shrink-0 items-center justify-center self-center rounded-full text-white outline-none transition-colors hover:bg-white/5"
aria-label="Open chat"
onClick={() => void setViewMode("chat")}
className="group relative flex size-11 shrink-0 items-center justify-center self-center rounded-full outline-none transition-transform hover:scale-[1.03] focus-visible:ring-2 focus-visible:ring-[#4BA0FA]/50"
>
<Plus className="size-7" strokeWidth={2.25} />
<NovaOrb
size={42}
className="pointer-events-none blur-[1px]! transition-transform group-hover:scale-105"
/>
</button>
<NavTab
label="Chat"
icon={MessageCircleIcon}
active={isChat}
onClick={() => void setViewMode("chat")}
label="Add"
icon={Plus}
active={false}
onClick={() => onAddMemory?.()}
/>
<DropdownMenu>
<DropdownMenuTrigger asChild>
Expand Down
68 changes: 37 additions & 31 deletions apps/web/components/connect-ai-modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -338,42 +338,43 @@ export function ConnectAIModal({
return (
<Dialog onOpenChange={setIsOpen} open={isOpen}>
<DialogTrigger asChild>{children}</DialogTrigger>
<DialogContent className="sm:max-w-4xl">
<DialogHeader>
<DialogContent className="max-h-[calc(100dvh-1rem)] w-[calc(100vw-1rem)] max-w-[calc(100vw-1rem)] overflow-y-auto overflow-x-hidden p-4 sm:max-w-4xl sm:p-6">
<DialogHeader className="pr-7 sm:pr-0">
<DialogTitle>Connect supermemory to Your AI</DialogTitle>
<DialogDescription>
Enable your AI assistant to create, search, and access your memories
directly using the Model Context Protocol (MCP).
</DialogDescription>
</DialogHeader>

<div className="space-y-6">
<div className="min-w-0 space-y-6">
{/* Step 1: Client Selection */}
<div className="space-y-4">
<div className="min-w-0 space-y-4">
<div className="flex items-center gap-3">
<div className="size-8 rounded-full flex items-center justify-center text-sm font-semibold bg-accent text-accent-foreground">
1
</div>
<h3 className="text-sm font-medium">Select Your AI Client</h3>
</div>

<div className="space-x-2 space-y-2">
<div className="flex min-w-0 flex-wrap gap-2">
{Object.entries(clients).map(([key, clientName]) => (
<button
className={`pr-3 pl-1 rounded-full border cursor-pointer transition-all ${
className={cn(
"max-w-full rounded-full border py-0.5 pr-3 pl-1 cursor-pointer transition-all",
selectedClient === key
? "border-primary bg-primary/10"
: "border-border hover:border-border/60 hover:bg-muted/50"
}`}
: "border-border hover:border-border/60 hover:bg-muted/50",
)}
key={key}
onClick={() => {
setSelectedClient(key as keyof typeof clients)
setSetupTab(defaultMcpSetupTab(getMcpClientSetup(key)))
}}
type="button"
>
<div className="flex items-center gap-1">
<div className="size-8 flex items-center justify-center">
<div className="flex min-w-0 items-center gap-1">
<div className="size-7 shrink-0 flex items-center justify-center sm:size-8">
<Image
alt={clientName}
className="rounded object-contain"
Expand Down Expand Up @@ -403,7 +404,7 @@ export function ConnectAIModal({
width={20}
/>
</div>
<span className="text-sm font-medium text-foreground/80">
<span className="truncate text-sm font-medium text-foreground/80">
{clientName}
</span>
</div>
Expand All @@ -413,7 +414,7 @@ export function ConnectAIModal({
</div>

{selectedClient && (
<div className="space-y-4">
<div className="min-w-0 space-y-4">
<div className="flex items-center gap-3">
<div className="flex size-8 items-center justify-center rounded-full bg-accent text-sm font-semibold text-accent-foreground">
2
Expand All @@ -424,13 +425,13 @@ export function ConnectAIModal({
<div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between sm:gap-4">
{clientSetup && mcpClientSetupShowsTabs(clientSetup) ? (
<div
className="flex w-full max-w-md flex-row gap-1 rounded-full border border-border bg-muted/50 p-1 sm:w-auto sm:min-w-[280px]"
className="flex w-full min-w-0 max-w-full flex-row gap-1 rounded-full border border-border bg-muted/50 p-1 sm:w-auto sm:min-w-[280px]"
role="tablist"
aria-label="Setup method"
>
<button
className={cn(
"min-h-9 flex-1 rounded-full px-3 py-2 text-center text-xs font-medium transition-all",
"min-h-9 flex-1 rounded-full px-2 py-2 text-center text-xs font-medium transition-all sm:px-3",
effectiveSetupTab === "manual"
? "border border-border bg-background text-foreground shadow-sm"
: "text-muted-foreground hover:text-foreground",
Expand All @@ -444,7 +445,7 @@ export function ConnectAIModal({
</button>
<button
className={cn(
"min-h-9 flex-1 rounded-full px-3 py-2 text-center text-xs font-medium transition-all",
"min-h-9 flex-1 rounded-full px-2 py-2 text-center text-xs font-medium transition-all sm:px-3",
effectiveSetupTab === "oneClick"
? "border border-border bg-background text-foreground shadow-sm"
: "text-muted-foreground hover:text-foreground",
Expand All @@ -461,7 +462,7 @@ export function ConnectAIModal({
{selectedClient !== "mcp-url" && (
<div
className={cn(
"flex justify-end",
"flex justify-start sm:justify-end",
!(
clientSetup && mcpClientSetupShowsTabs(clientSetup)
) && "w-full sm:justify-start",
Expand Down Expand Up @@ -523,9 +524,9 @@ export function ConnectAIModal({
Paste this URL into clients that support remote MCP
over HTTPS (OAuth).
</p>
<div className="relative max-w-xl">
<div className="relative max-w-full sm:max-w-xl">
<Input
className="w-full pr-10 font-mono text-xs"
className="w-full min-w-0 pr-10 font-mono text-xs"
readOnly
value={CHATGPT_REMOTE_MCP_URL}
/>
Expand All @@ -552,7 +553,7 @@ export function ConnectAIModal({
Optional: scope installs to a project. Then copy and
run the command in your terminal.
</p>
<div className="max-w-md">
<div className="max-w-full sm:max-w-md">
<Select
disabled={isLoadingProjects}
onValueChange={setSelectedProject}
Expand Down Expand Up @@ -586,7 +587,7 @@ export function ConnectAIModal({
</div>
<div className="relative max-w-full">
<Input
className="w-full pr-10 font-mono text-xs"
className="w-full min-w-0 pr-10 font-mono text-xs"
readOnly
value={generateInstallCommand()}
/>
Expand Down Expand Up @@ -622,9 +623,9 @@ export function ConnectAIModal({
</li>
<li>Complete OAuth in ChatGPT.</li>
</ol>
<div className="relative max-w-xl">
<div className="relative max-w-full sm:max-w-xl">
<Input
className="w-full pr-10 font-mono text-xs"
className="w-full min-w-0 pr-10 font-mono text-xs"
readOnly
value={CHATGPT_REMOTE_MCP_URL}
/>
Expand Down Expand Up @@ -677,8 +678,8 @@ export function ConnectAIModal({
</div>
) : (
<>
<div className="relative max-w-full">
<pre className="max-h-80 overflow-x-auto overflow-y-auto rounded-lg border border-border bg-muted p-4 pr-12 text-xs">
<div className="relative min-w-0 max-w-full">
<pre className="max-h-80 max-w-full overflow-x-auto overflow-y-auto rounded-lg border border-border bg-muted p-3 pr-12 text-xs sm:p-4">
<code className="block font-mono whitespace-pre-wrap break-all">
{remoteSnippet}
</code>
Expand Down Expand Up @@ -715,8 +716,8 @@ export function ConnectAIModal({
Merge the snippet with your existing config. Restart
the client and sign in with OAuth when prompted.
</p>
<div className="relative max-w-full">
<pre className="max-h-80 overflow-x-auto overflow-y-auto rounded-lg border border-border bg-muted p-4 pr-12 text-xs">
<div className="relative min-w-0 max-w-full">
<pre className="max-h-80 max-w-full overflow-x-auto overflow-y-auto rounded-lg border border-border bg-muted p-3 pr-12 text-xs sm:p-4">
<code className="block font-mono whitespace-pre-wrap break-all">
{manual.snippet}
</code>
Expand Down Expand Up @@ -782,8 +783,8 @@ export function ConnectAIModal({
</div>
</div>

<div className="bg-muted/50 rounded-lg p-4 border border-border">
<div className="flex items-center justify-between mb-3">
<div className="rounded-lg border border-border bg-muted/50 p-4">
<div className="mb-3 flex flex-wrap items-center justify-between gap-2">
<h3 className="text-sm font-medium">Connection Status</h3>
<div className="flex items-center gap-2 text-xs">
{isCheckingConnection ? (
Expand Down Expand Up @@ -817,8 +818,8 @@ export function ConnectAIModal({
</ul>
</div>

<div className="flex justify-between items-center pt-4">
<div className="flex items-center gap-4">
<div className="flex flex-col gap-3 pt-4 sm:flex-row sm:items-center sm:justify-between">
<div className="flex flex-wrap items-center gap-2 sm:gap-4">
<Button
onClick={() =>
window.open(
Expand All @@ -839,7 +840,12 @@ export function ConnectAIModal({
Migrate from v1
</Button>
</div>
<Button onClick={() => setIsOpen(false)}>Done</Button>
<Button
className="w-full sm:w-auto"
onClick={() => setIsOpen(false)}
>
Done
</Button>
</div>
</div>
</DialogContent>
Expand Down
20 changes: 10 additions & 10 deletions apps/web/components/settings/account.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -425,7 +425,7 @@ export default function Account() {
<SettingsCard>
<div className="flex flex-col gap-6">
{/* Avatar + Name/Email */}
<div className="flex items-center gap-4">
<div className="flex min-w-0 items-center gap-4">
<div className="relative size-16 rounded-full bg-linear-to-b from-[#0D121A] to-black overflow-hidden shrink-0">
<Avatar className="size-full">
<AvatarImage
Expand All @@ -438,28 +438,28 @@ export default function Account() {
</AvatarFallback>
</Avatar>
</div>
<div className="flex flex-col gap-1.5">
<div className="flex min-w-0 flex-col gap-1.5">
<p
className={cn(
dmSans125ClassName(),
"font-semibold text-[20px] tracking-[-0.2px] text-[#FAFAFA]",
"truncate font-semibold text-[20px] tracking-[-0.2px] text-[#FAFAFA]",
)}
>
{user?.name ?? "—"}
</p>
<p
className={cn(
dmSans125ClassName(),
"font-medium text-[16px] tracking-[-0.16px] text-[#FAFAFA]",
"truncate font-medium text-[16px] tracking-[-0.16px] text-[#FAFAFA]",
)}
>
{user?.email ?? "—"}
</p>
</div>
</div>

<div className="flex gap-4">
<div className="flex-1 flex flex-col gap-2">
<div className="flex flex-col gap-4 sm:flex-row">
<div className="flex min-w-0 flex-1 flex-col gap-2">
<p
className={cn(
dmSans125ClassName(),
Expand All @@ -477,7 +477,7 @@ export default function Account() {
<PopoverTrigger
disabled={!canSwitchOrg}
className={cn(
"flex items-center gap-2 transition-opacity",
"flex min-w-0 max-w-full items-center gap-2 transition-opacity",
canSwitchOrg
? "cursor-pointer hover:opacity-90"
: "cursor-default",
Expand All @@ -487,13 +487,13 @@ export default function Account() {
<span
className={cn(
dmSans125ClassName(),
"font-medium text-[16px] tracking-[-0.16px] text-[#FAFAFA]",
"truncate font-medium text-[16px] tracking-[-0.16px] text-[#FAFAFA]",
)}
>
{org?.name ?? "Personal"}
</span>
{canSwitchOrg && (
<ChevronDown className="size-4 text-[#737373]" />
<ChevronDown className="size-4 shrink-0 text-[#737373]" />
)}
</PopoverTrigger>
{canSwitchOrg && (
Expand Down Expand Up @@ -549,7 +549,7 @@ export default function Account() {
)}
</Popover>
</div>
<div className="flex-1 flex flex-col gap-2">
<div className="flex min-w-0 flex-1 flex-col gap-2">
<p
className={cn(
dmSans125ClassName(),
Expand Down
6 changes: 3 additions & 3 deletions apps/web/components/settings/connections-mcp.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -581,19 +581,19 @@ export default function ConnectionsMCP() {
!hasProProduct && !isLoading && "opacity-30 pointer-events-none",
)}
>
<div className="flex items-center justify-between">
<div className="flex items-center justify-between gap-3">
<span
className={cn(
dmSans125ClassName(),
"font-semibold text-[16px] tracking-[-0.16px] text-[#FAFAFA]",
"min-w-0 flex-1 truncate font-semibold text-[15px] tracking-[-0.16px] text-[#FAFAFA] sm:text-[16px]",
)}
>
Connected to Supermemory
</span>
<span
className={cn(
dmSans125ClassName(),
"font-semibold text-[16px] tracking-[-0.16px] text-[#737373]",
"shrink-0 whitespace-nowrap text-right font-semibold text-[13px] tracking-[-0.16px] text-[#737373] sm:text-[16px]",
)}
>
{connections.length}/{connectionsLimit} connections used
Expand Down
Loading