Hook up empty state buttons for first-launch experience

This commit is contained in:
Gregory Schier
2024-02-23 16:34:19 -08:00
parent fd5b495b70
commit e75e6865ea
4 changed files with 110 additions and 91 deletions

View File

@@ -1,18 +1,11 @@
import { memo } from 'react';
import { useCreateFolder } from '../hooks/useCreateFolder';
import { useCreateGrpcRequest } from '../hooks/useCreateGrpcRequest';
import { useCreateHttpRequest } from '../hooks/useCreateHttpRequest';
import { useSidebarHidden } from '../hooks/useSidebarHidden';
import { trackEvent } from '../lib/analytics';
import { BODY_TYPE_GRAPHQL } from '../lib/models';
import { Dropdown } from './core/Dropdown';
import { IconButton } from './core/IconButton';
import { HStack } from './core/Stacks';
import { CreateDropdown } from './CreateDropdown';
export const SidebarActions = memo(function SidebarActions() {
const createHttpRequest = useCreateHttpRequest();
const createGrpcRequest = useCreateGrpcRequest();
const createFolder = useCreateFolder();
const { hidden, show, hide } = useSidebarHidden();
return (
@@ -32,37 +25,9 @@ export const SidebarActions = memo(function SidebarActions() {
hotkeyAction="sidebar.toggle"
icon={hidden ? 'leftPanelHidden' : 'leftPanelVisible'}
/>
<Dropdown
openOnHotKeyAction="http_request.create"
items={[
{
key: 'create-http-request',
label: 'HTTP Request',
onSelect: () => createHttpRequest.mutate({}),
},
{
key: 'create-graphql-request',
label: 'GraphQL Query',
onSelect: () =>
createHttpRequest.mutate({ bodyType: BODY_TYPE_GRAPHQL, method: 'POST' }),
},
{
key: 'create-grpc-request',
label: 'gRPC Call',
onSelect: () => createGrpcRequest.mutate({}),
},
{
type: 'separator',
},
{
key: 'create-folder',
label: 'Folder',
onSelect: () => createFolder.mutate({}),
},
]}
>
<CreateDropdown>
<IconButton size="sm" icon="plusCircle" title="Add Resource" />
</Dropdown>
</CreateDropdown>
</HStack>
);
});