Skip to content

Commit 01ae538

Browse files
debsmita1debsmita1
committed
expose partial drawer context for ApplicationDrawer
1 parent ea3cbe4 commit 01ae538

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+2625
-425
lines changed

‎workspaces/global-floating-action-button/plugins/global-floating-action-button/src/components/FloatingButton.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,10 @@ const useStyles = makeStyles(theme => ({
3131
right: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,
3232
alignItems: 'end',
3333

34-
// When quickstart drawer is open, adjust margin
35-
'.quickstart-drawer-open &': {
34+
// When drawer is docked, adjust margin
35+
'.docked-drawer-open &': {
3636
transition: 'margin-right 0.3s ease',
37-
marginRight: 'var(--quickstart-drawer-width, 500px) ',
37+
marginRight: 'var(--docked-drawer-width, 500px) ',
3838
},
3939
},
4040
'bottom-left': {

‎workspaces/lightspeed/packages/app/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
"@backstage/ui": "^0.8.2",
4747
"@material-ui/core": "^4.12.2",
4848
"@material-ui/icons": "^4.9.1",
49+
"@red-hat-developer-hub/backstage-plugin-global-floating-action-button": "^1.6.1",
4950
"@red-hat-developer-hub/backstage-plugin-lightspeed": "*",
5051
"react": "^18.0.2",
5152
"react-dom": "^18.0.2",

‎workspaces/lightspeed/packages/app/src/App.tsx‎

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ import { Root } from './components/Root';
4343

4444
import {
4545
AlertDisplay,
46+
IdentityProviders,
4647
OAuthRequestDialog,
4748
SignInPage,
4849
} from '@backstage/core-components';
@@ -52,7 +53,19 @@ import { CatalogGraphPage } from '@backstage/plugin-catalog-graph';
5253
import { RequirePermission } from '@backstage/plugin-permission-react';
5354
import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';
5455
import { lightspeedTranslations } from '@red-hat-developer-hub/backstage-plugin-lightspeed/alpha';
56+
import { githubAuthApiRef } from '@backstage/core-plugin-api';
5557
import { LightspeedPage } from '@red-hat-developer-hub/backstage-plugin-lightspeed';
58+
import { LightspeedDrawerProvider } from '@red-hat-developer-hub/backstage-plugin-lightspeed';
59+
60+
const identityProviders: IdentityProviders = [
61+
'guest',
62+
{
63+
id: 'github-auth-provider',
64+
title: 'GitHub',
65+
message: 'Sign in using GitHub',
66+
apiRef: githubAuthApiRef,
67+
},
68+
];
5669

5770
const app = createApp({
5871
apis,
@@ -78,7 +91,9 @@ const app = createApp({
7891
});
7992
},
8093
components: {
81-
SignInPage: props => <SignInPage {...props} auto providers={['guest']} />,
94+
SignInPage: props => (
95+
<SignInPage {...props} auto providers={identityProviders} />
96+
),
8297
},
8398
});
8499

@@ -117,6 +132,7 @@ const routes = (
117132
<Route path="/settings" element={<UserSettingsPage />} />
118133
<Route path="/catalog-graph" element={<CatalogGraphPage />} />
119134
<Route path="/lightspeed" element={<LightspeedPage />} />
135+
<Route path="/lightspeed/conversation/:id" element={<LightspeedPage />} />
120136
</FlatRoutes>
121137
);
122138

@@ -125,7 +141,9 @@ export default app.createRoot(
125141
<AlertDisplay />
126142
<OAuthRequestDialog />
127143
<AppRouter>
128-
<Root>{routes}</Root>
144+
<LightspeedDrawerProvider>
145+
<Root>{routes}</Root>
146+
</LightspeedDrawerProvider>
129147
</AppRouter>
130148
</>,
131149
);

‎workspaces/lightspeed/packages/app/src/components/Root/Root.tsx‎

Lines changed: 65 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,11 @@ import MenuIcon from '@material-ui/icons/Menu';
4343
import SearchIcon from '@material-ui/icons/Search';
4444
import { MyGroupsSidebarItem } from '@backstage/plugin-org';
4545
import GroupIcon from '@material-ui/icons/People';
46-
47-
import { LightspeedIcon } from '@red-hat-developer-hub/backstage-plugin-lightspeed';
48-
import { IconComponent } from '@backstage/core-plugin-api';
46+
import { GlobalFloatingActionButton } from '@red-hat-developer-hub/backstage-plugin-global-floating-action-button';
47+
import {
48+
LightspeedFABIcon,
49+
useLightspeedDrawerContext,
50+
} from '@red-hat-developer-hub/backstage-plugin-lightspeed';
4951

5052
const useSidebarLogoStyles = makeStyles({
5153
root: {
@@ -75,46 +77,64 @@ const SidebarLogo = () => {
7577
);
7678
};
7779

78-
export const Root = ({ children }: PropsWithChildren<{}>) => (
79-
<SidebarPage>
80-
<Sidebar>
81-
<SidebarLogo />
82-
<SidebarGroup label="Search" icon={<SearchIcon />} to="/search">
83-
<SidebarSearchModal />
84-
</SidebarGroup>
85-
<SidebarDivider />
86-
<SidebarGroup label="Menu" icon={<MenuIcon />}>
87-
{/* Global nav, not org-specific */}
88-
<SidebarItem icon={HomeIcon} to="catalog" text="Home" />
89-
<MyGroupsSidebarItem
90-
singularTitle="My Group"
91-
pluralTitle="My Groups"
92-
icon={GroupIcon}
93-
/>
94-
<SidebarItem icon={ExtensionIcon} to="api-docs" text="APIs" />
95-
<SidebarItem icon={LibraryBooks} to="docs" text="Docs" />
96-
<SidebarItem icon={CreateComponentIcon} to="create" text="Create..." />
97-
<SidebarItem
98-
icon={LightspeedIcon as IconComponent}
99-
to="lightspeed"
100-
text="Lightspeed"
101-
/>
102-
;{/* End global nav */}
80+
export const Root = ({ children }: PropsWithChildren<{}>) => {
81+
const { isChatbotActive, toggleChatbot } = useLightspeedDrawerContext();
82+
83+
return (
84+
<SidebarPage>
85+
<GlobalFloatingActionButton
86+
floatingButtons={[
87+
{
88+
color: 'inherit',
89+
icon: <LightspeedFABIcon />,
90+
label: 'Lightspeed',
91+
toolTip: isChatbotActive ? 'Close Lightspeed' : 'Open Lightspeed',
92+
size: 'small',
93+
isOpen: isChatbotActive,
94+
displayCloseWhenOpen: true,
95+
onClick: toggleChatbot,
96+
disableHoverEffect: true,
97+
},
98+
]}
99+
/>
100+
<Sidebar>
101+
<SidebarLogo />
102+
<SidebarGroup label="Search" icon={<SearchIcon />} to="/search">
103+
<SidebarSearchModal />
104+
</SidebarGroup>
103105
<SidebarDivider />
104-
<SidebarScrollWrapper>
105-
{/* Items in this group will be scrollable if they run out of space */}
106-
</SidebarScrollWrapper>
107-
</SidebarGroup>
108-
<SidebarSpace />
109-
<SidebarDivider />
110-
<SidebarGroup
111-
label="Settings"
112-
icon={<UserSettingsSignInAvatar />}
113-
to="/settings"
114-
>
115-
<SidebarSettings />
116-
</SidebarGroup>
117-
</Sidebar>
118-
{children}
119-
</SidebarPage>
120-
);
106+
<SidebarGroup label="Menu" icon={<MenuIcon />}>
107+
{/* Global nav, not org-specific */}
108+
<SidebarItem icon={HomeIcon} to="catalog" text="Home" />
109+
<MyGroupsSidebarItem
110+
singularTitle="My Group"
111+
pluralTitle="My Groups"
112+
icon={GroupIcon}
113+
/>
114+
<SidebarItem icon={ExtensionIcon} to="api-docs" text="APIs" />
115+
<SidebarItem icon={LibraryBooks} to="docs" text="Docs" />
116+
<SidebarItem
117+
icon={CreateComponentIcon}
118+
to="create"
119+
text="Create..."
120+
/>
121+
{/* End global nav */}
122+
<SidebarDivider />
123+
<SidebarScrollWrapper>
124+
{/* Items in this group will be scrollable if they run out of space */}
125+
</SidebarScrollWrapper>
126+
</SidebarGroup>
127+
<SidebarSpace />
128+
<SidebarDivider />
129+
<SidebarGroup
130+
label="Settings"
131+
icon={<UserSettingsSignInAvatar />}
132+
to="/settings"
133+
>
134+
<SidebarSettings />
135+
</SidebarGroup>
136+
</Sidebar>
137+
{children}
138+
</SidebarPage>
139+
);
140+
};

‎workspaces/lightspeed/plugins/lightspeed/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
"@patternfly/react-core": "6.4.0",
6262
"@patternfly/react-icons": "^6.3.1",
6363
"@red-hat-developer-hub/backstage-plugin-lightspeed-common": "workspace:^",
64+
"@red-hat-developer-hub/backstage-plugin-theme": "^0.10.0",
6465
"@tanstack/react-query": "^5.59.15",
6566
"react-markdown": "^9.0.1",
6667
"react-use": "^17.2.4"

0 commit comments

Comments
 (0)