Skip to content
Merged
Show file tree
Hide file tree
Changes from all 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
106 changes: 66 additions & 40 deletions js/app/packages/app/component/settings/Settings.tsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,58 @@
import { type SettingsTab, setSettingsOpen, useSettingsState } from '@core/constant/SettingsState';
import { createEffect, createMemo, createSignal, For, onCleanup, Show, Suspense } from 'solid-js';
import { DEV_MODE_ENV, ENABLE_AI_MEMORY } from '@core/constant/featureFlags';
import { withAnalytics } from '@coparse/analytics';
import { DEV_MODE_ENV } from '@core/constant/featureFlags';
import {
type SettingsTab,
setSettingsOpen,
useSettingsState,
} from '@core/constant/SettingsState';
import { TOKENS } from '@core/hotkey/tokens';
import { isNativeMobilePlatform } from '@core/mobile/isNativeMobilePlatform';
import { MacroPermissions, usePermissions } from '@service-gql/client';
import { isMobileWidth } from '@core/mobile/mobileWidth';
import Organization from './Organization/Organization';
import { registerHotkey } from 'core/hotkey/hotkeys';
import { withAnalytics } from '@coparse/analytics';
import { useOrganizationName } from '@core/user';
import { AiMemory } from './AiMemory/AiMemory';
import { Notification } from './Notification';
import { Subscription } from './Subscription';
import { TOKENS } from '@core/hotkey/tokens';
import { Appearance } from './Appearance';
import Dialog from '@corvu/dialog';
import { Tabs } from '@kobalte/core/tabs';
import { MacroPermissions, usePermissions } from '@service-gql/client';
import { registerHotkey } from 'core/hotkey/hotkeys';
import {
createEffect,
createMemo,
createSignal,
For,
onCleanup,
Show,
Suspense,
} from 'solid-js';
import MacroJump from '../MacroJump';
import { Account } from './Account';
import Dialog from '@corvu/dialog';
import { Appearance } from './Appearance';
import { Notification } from './Notification';
import Organization from './Organization/Organization';
import { Subscription } from './Subscription';

export const [viewportOffset, setViewportOffset] = createSignal(0);

const SCROLL_THRESHOLD = 10;

const { track, TrackingEvents } = withAnalytics();
export function Settings() {
const { settingsOpen, closeSettings, activeTabId, setActiveTabId, toggleSettings } = useSettingsState();
const {
settingsOpen,
closeSettings,
activeTabId,
setActiveTabId,
toggleSettings,
} = useSettingsState();
const permissions = usePermissions();
const orgName = useOrganizationName();

let scrollRef!: HTMLDivElement;
let scrollCleanup: (() => void) | undefined;
const [leftOpacity, setLeftOpacity] = createSignal(0);
const [rightOpacity, setRightOpacity] = createSignal(0);
const [indicatorStyle, setIndicatorStyle] = createSignal({left: 0, width: 0 });
const [indicatorStyle, setIndicatorStyle] = createSignal({
left: 0,
width: 0,
});

const updateClipIndicators = () => {
if (!scrollRef) return;
Expand All @@ -57,25 +77,25 @@ export function Settings() {
});
};

function setupScrollListeners(element: HTMLDivElement){
function listener(e: WheelEvent){
function setupScrollListeners(element: HTMLDivElement) {
function listener(e: WheelEvent) {
e.preventDefault();
const { deltaX, deltaY } = e;
const delta = Math.abs(deltaX) > Math.abs(deltaY) ? deltaX : deltaY;
element.scrollLeft += delta;
updateClipIndicators();
};
}
element.addEventListener('wheel', listener);
element.addEventListener('scroll', updateClipIndicators);
updateClipIndicators();
return () => {
element.removeEventListener('wheel', listener);
element.removeEventListener('scroll', updateClipIndicators);
};
};
}

onCleanup(() => {
if(scrollCleanup){
if (scrollCleanup) {
scrollCleanup();
}
});
Expand All @@ -85,27 +105,24 @@ export function Settings() {
this will be replaced with <Show when={}>
*/
const settingsTabs = createMemo(() => {
const tabs: {value: string; label: string }[] = [];
const tabs: { value: string; label: string }[] = [];

tabs.push({value: 'Appearance', label: 'Appearance'});
tabs.push({ value: 'Appearance', label: 'Appearance' });

tabs.push({value: 'Account', label: 'Account'});
tabs.push({ value: 'Account', label: 'Account' });

if(!orgName() && !isNativeMobilePlatform()){
tabs.push({value: 'Subscription', label: 'Subscription'})
if (!orgName() && !isNativeMobilePlatform()) {
tabs.push({ value: 'Subscription', label: 'Subscription' });
}

if(orgName() && permissions()?.includes(MacroPermissions.WriteItPanel)){
tabs.push({value: 'Organization', label: 'Organization'})
if (orgName() && permissions()?.includes(MacroPermissions.WriteItPanel)) {
tabs.push({ value: 'Organization', label: 'Organization' });
}

tabs.push({value: 'Notification', label: 'Notification'});
tabs.push({ value: 'Notification', label: 'Notification' });

if(isNativeMobilePlatform() && DEV_MODE_ENV){
tabs.push({ value: 'Mobile', label: 'Mobile Dev Tools' })
}
if(ENABLE_AI_MEMORY){
tabs.push({ value: 'AI Memory', label: 'AI Memory' })
if (isNativeMobilePlatform() && DEV_MODE_ENV) {
tabs.push({ value: 'Mobile', label: 'Mobile Dev Tools' });
}

return tabs;
Expand Down Expand Up @@ -149,7 +166,16 @@ export function Settings() {
<Tabs
value={activeTabId()}
onChange={(value: string | undefined) => {
if(value && (value === 'Account' || value === 'Subscription' || value === 'Organization' || value === 'Appearance' || value === 'Notification' || value === 'Mobile' || value === 'AI Memory')){
if (
value &&
(value === 'Account' ||
value === 'Subscription' ||
value === 'Organization' ||
value === 'Appearance' ||
value === 'Notification' ||
value === 'Mobile' ||
value === 'AI Memory')
) {
setActiveTabId(value as SettingsTab);
track(TrackingEvents.SETTINGS.CHANGETAB, { tab: value });
}
Expand Down Expand Up @@ -239,7 +265,12 @@ export function Settings() {
<Subscription />
</Tabs.Content>
</Show>
<Show when={ orgName() && permissions()?.includes(MacroPermissions.WriteItPanel)}>
<Show
when={
orgName() &&
permissions()?.includes(MacroPermissions.WriteItPanel)
}
>
<Tabs.Content value="Organization" class="h-full">
<Organization />
</Tabs.Content>
Expand All @@ -250,11 +281,6 @@ export function Settings() {
<Tabs.Content value="Notification" class="h-full">
<Notification />
</Tabs.Content>
<Show when={ENABLE_AI_MEMORY}>
<Tabs.Content value="AI Memory" class="h-full">
<AiMemory />
</Tabs.Content>
</Show>
</div>
</Tabs>
</Dialog.Content>
Expand Down
6 changes: 0 additions & 6 deletions js/app/packages/core/component/AI/constant/prompts.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { useInstructionsMdTextQuery } from '@service-storage/instructionsMd';
import { createMemo } from 'solid-js';
import { useFormatMemoriesQuery } from './memories';

const ABOUT_MACRO = `
Macro is an AI workspace with all the latest models and built-in editors for pdfs, docs, notes, images, diagrams, chats and more. Macro is like ChatGPT but you can do all your work inside it+
Expand All @@ -27,7 +26,6 @@ Internal terminology and knowledge

export function useAdditionalInstructions() {
const userInstructionsQuery = useInstructionsMdTextQuery();
const memory = useFormatMemoriesQuery();
return createMemo(() => {
let prompt = ABOUT_MACRO;
const userInstructions = userInstructionsQuery.data;
Expand All @@ -36,10 +34,6 @@ export function useAdditionalInstructions() {
'\nThese are system instructions provided by the user. Follow them\n';
prompt += userInstructions;
}
const memories = memory.data;
if (memories) {
prompt += memories;
}
return appendDate(prompt);
});
}
Expand Down
2 changes: 0 additions & 2 deletions js/app/packages/core/constant/featureFlags.ts
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,6 @@ export const ENABLE_EMAIL = true;

export const ENABLE_BLOCK_IN_BLOCK = true;

export const ENABLE_AI_MEMORY = true;

export const EDITABLE_SMART_INSIGHTS = false;

export const ENABLE_SEARCH_SERVICE = true;
Expand Down