OpenDefaultAiAssistantButton.tsx 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import React, { type JSX, useCallback, useMemo } from 'react';
  2. import { useAtomValue } from 'jotai';
  3. import { useTranslation } from 'react-i18next';
  4. import { NotAvailable } from '~/client/components/NotAvailable';
  5. import { NotAvailableForGuest } from '~/client/components/NotAvailableForGuest';
  6. import { aiEnabledAtom } from '~/states/server-configurations';
  7. import { useAiAssistantSidebarActions } from '../../states';
  8. import { useSWRxAiAssistants } from '../../stores/ai-assistant';
  9. import styles from './OpenDefaultAiAssistantButton.module.scss';
  10. const OpenDefaultAiAssistantButtonSubstance = (): JSX.Element => {
  11. const { t } = useTranslation();
  12. const { data: aiAssistantData } = useSWRxAiAssistants();
  13. const { openChat } = useAiAssistantSidebarActions();
  14. const defaultAiAssistant = useMemo(() => {
  15. if (aiAssistantData == null) {
  16. return null;
  17. }
  18. const allAiAssistants = [
  19. ...aiAssistantData.myAiAssistants,
  20. ...aiAssistantData.teamAiAssistants,
  21. ];
  22. return allAiAssistants.find((aiAssistant) => aiAssistant.isDefault);
  23. }, [aiAssistantData]);
  24. const openDefaultAiAssistantButtonClickHandler = useCallback(() => {
  25. if (defaultAiAssistant == null) {
  26. return;
  27. }
  28. openChat(defaultAiAssistant);
  29. }, [defaultAiAssistant, openChat]);
  30. return (
  31. <NotAvailableForGuest>
  32. <NotAvailable
  33. isDisabled={defaultAiAssistant == null}
  34. title={t('default_ai_assistant.not_set')}
  35. >
  36. <button
  37. type="button"
  38. className={`btn btn-search ${styles['btn-open-default-ai-assistant']}`}
  39. onClick={openDefaultAiAssistantButtonClickHandler}
  40. >
  41. <span className="growi-custom-icons fs-4 align-middle lh-1">
  42. ai_assistant
  43. </span>
  44. </button>
  45. </NotAvailable>
  46. </NotAvailableForGuest>
  47. );
  48. };
  49. const OpenDefaultAiAssistantButton = (): JSX.Element => {
  50. const isAiEnabled = useAtomValue(aiEnabledAtom);
  51. if (!isAiEnabled) {
  52. return <></>;
  53. }
  54. return <OpenDefaultAiAssistantButtonSubstance />;
  55. };
  56. export default OpenDefaultAiAssistantButton;