Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00
Code Issues Activity

feat(console): add guide for organization template page (#5647)

Browse source
This commit is contained in:
Xiao Yijun 2024-04-09 10:33:02 +08:00 committed by GitHub
parent 77db93905d
commit d90b6151a5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 16 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
packages/console/src/pages/OrganizationTemplate/index.tsx
View file

@ -1,8 +1,10 @@
import { withAppInsights } from '@logto/app-insights/react/AppInsightsReact'; import { withAppInsights } from '@logto/app-insights/react/AppInsightsReact';
import classNames from 'classnames'; import classNames from 'classnames';
import { useState } from 'react';
import { Outlet } from 'react-router-dom'; import { Outlet } from 'react-router-dom';
import Research from '@/assets/icons/research.svg'; import Research from '@/assets/icons/research.svg';
import Drawer from '@/components/Drawer';
import PageMeta from '@/components/PageMeta'; import PageMeta from '@/components/PageMeta';
import { OrganizationTemplateTabs, organizationTemplateLink } from '@/consts'; import { OrganizationTemplateTabs, organizationTemplateLink } from '@/consts';
import Button from '@/ds-components/Button'; import Button from '@/ds-components/Button';
@ -12,12 +14,15 @@ import TabNav, { TabNavItem } from '@/ds-components/TabNav';
import useDocumentationUrl from '@/hooks/use-documentation-url'; import useDocumentationUrl from '@/hooks/use-documentation-url';
import * as pageLayout from '@/scss/page-layout.module.scss'; import * as pageLayout from '@/scss/page-layout.module.scss';
import Introduction from '../Organizations/Guide/Introduction';
import * as styles from './index.module.scss'; import * as styles from './index.module.scss';
const basePathname = '/organization-template'; const basePathname = '/organization-template';
function OrganizationTemplate() { function OrganizationTemplate() {
const { getDocumentationUrl } = useDocumentationUrl(); const { getDocumentationUrl } = useDocumentationUrl();
const [isGuideDrawerOpen, setIsGuideDrawerOpen] = useState(false);
return ( return (
<div className={classNames(pageLayout.container, styles.container)}> <div className={classNames(pageLayout.container, styles.container)}>
@ -36,9 +41,19 @@ function OrganizationTemplate() {
title="application_details.check_guide" title="application_details.check_guide"
type="outline" type="outline"
onClick={() => { onClick={() => {
// Todo @xiaoyijun implement guide setIsGuideDrawerOpen(true);
}} }}
/> />
<Drawer
title="organizations.guide.title"
subtitle="organizations.guide.subtitle"
isOpen={isGuideDrawerOpen}
onClose={() => {
setIsGuideDrawerOpen(false);
}}
>
<Introduction isReadonly />
</Drawer>
</div> </div>
<TabNav> <TabNav>
<TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrganizationRoles}`}> <TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrganizationRoles}`}>