diff --git a/daikoku/javascript/src/components/utils/sidebar/SideBar.tsx b/daikoku/javascript/src/components/utils/sidebar/SideBar.tsx index 70c5dd6fe..7956d9565 100644 --- a/daikoku/javascript/src/components/utils/sidebar/SideBar.tsx +++ b/daikoku/javascript/src/components/utils/sidebar/SideBar.tsx @@ -6,6 +6,7 @@ import MessageSquare from 'react-feather/dist/icons/message-square'; import Plus from 'react-feather/dist/icons/plus'; import Search from 'react-feather/dist/icons/search'; import Zap from 'react-feather/dist/icons/zap'; +import More from 'react-feather/dist/icons/more-vertical'; import { Link, useLocation } from 'react-router-dom'; import RectangleList from 'react-feather/dist/icons/list'; import { I18nContext } from '../../../contexts/i18n-context'; @@ -14,6 +15,7 @@ import * as Services from '../../../services'; import { MessagesContext } from '../../backoffice'; import { Companion } from './companions'; import { AddPanel, DarkModeActivator, GuestPanel, MessagePanel, SearchPanel, SettingsPanel } from './panels'; +import { MorePanel } from './panels/MorePanel'; export const state = { @@ -60,24 +62,24 @@ export const SideBar = () => {
- - {translate("tenant.logo")} - -
- - - -
+ + {translate("tenant.logo")} + +
+ + + +
{!connectedUser.isGuest && ( <> @@ -103,16 +105,15 @@ export const SideBar = () => { )} {!connectedUser.isGuest && ( - - - +
+ { + setPanelState(state.opened); + setPanelContent(); + }} /> +
)}
diff --git a/daikoku/javascript/src/components/utils/sidebar/panels/MorePanel.tsx b/daikoku/javascript/src/components/utils/sidebar/panels/MorePanel.tsx new file mode 100644 index 000000000..1768daf74 --- /dev/null +++ b/daikoku/javascript/src/components/utils/sidebar/panels/MorePanel.tsx @@ -0,0 +1,36 @@ +import { useContext } from 'react'; +import { Link } from 'react-router-dom'; + +import { GlobalContext } from '../../../../contexts/globalContext'; +import { I18nContext } from '../../../../contexts/i18n-context'; + +export const MorePanel = () => { + const { translate } = useContext(I18nContext); + const { connectedUser } = useContext(GlobalContext); + + return ( +
+
+

{translate('more.nav.options')}

+
+
+
+
+ {!connectedUser.isGuest && ( + + {translate('fastMode.access')} + + + )} +
+
+
+
+ ); +}; diff --git a/daikoku/javascript/src/locales/en/translation.json b/daikoku/javascript/src/locales/en/translation.json index 48326054e..7d9274b10 100644 --- a/daikoku/javascript/src/locales/en/translation.json +++ b/daikoku/javascript/src/locales/en/translation.json @@ -1474,5 +1474,6 @@ "subscription.retrieve.login.required.message": "Please log in to continue. You need to be authenticated to access this feature.", "subscription.retrieve.token.unavalaible": "token unavailable", "Daikoku.home" : "Daikoku home", - "API.list" : "APIs list" + "API.list" : "APIs list", + "more.nav.options": "More options" } \ No newline at end of file diff --git a/daikoku/javascript/src/locales/fr/translation.json b/daikoku/javascript/src/locales/fr/translation.json index f28ae116d..089bb6147 100644 --- a/daikoku/javascript/src/locales/fr/translation.json +++ b/daikoku/javascript/src/locales/fr/translation.json @@ -1474,5 +1474,6 @@ "subscription.retrieve.login.required.message": "Veuillez vous connecter pour continuer. Vous devez être authentifié pour accéder à cette fonctionnalité.", "subscription.retrieve.token.unavalaible": "Le jeton n'est plus valable", "Daikoku.home" : "Accueil Daikoku", - "API.list" : "Liste des APIs" + "API.list" : "Liste des APIs", + "more.nav.options": "Plus d'options" } \ No newline at end of file diff --git a/daikoku/javascript/src/style/template/default.css b/daikoku/javascript/src/style/template/default.css index d60d8fe7f..658fb2057 100644 --- a/daikoku/javascript/src/style/template/default.css +++ b/daikoku/javascript/src/style/template/default.css @@ -23,7 +23,7 @@ --menu-text-color: #aaa; --menu-text-hover-bg-color: #444; --menu-text-hover-color: #fff; - --menu-link-color: #666;  + --menu-link-color: #666; --card_header-bg-color: #404040; --card_header-text-color: #fff; @@ -110,7 +110,7 @@ --form-select-hover-text-color: white; --error-color:#dc3545; -   --info-color: #17a2b8; + --info-color: #17a2b8; --success-color: #65B741; --warning-color: #ffc107; --danger-color: #dc3545; diff --git a/daikoku/javascript/tests/resources/daikoku-test-export.ndjson b/daikoku/javascript/tests/resources/daikoku-test-export.ndjson index 078f42b23..13099e907 100644 --- a/daikoku/javascript/tests/resources/daikoku-test-export.ndjson +++ b/daikoku/javascript/tests/resources/daikoku-test-export.ndjson @@ -1,4 +1,4 @@ -{"type":"tenants","payload":{"_id":"default","name":"Evil Corp.","style":{"js":"","css":"","logo":"/assets/images/daikoku.svg","jsUrl":null,"title":"Evil Corp.","cssUrl":null,"footer":null,"cacheTTL":60000,"colorTheme":":root {\n --error-color: #ff6347;\n --success-color: #65B741;\n\n --link-color: #7f96af;\n --link--hover-color: #8fa6bf;\n\n --body-bg-color: #fff;\n --body-text-color: #212529;\n --navbar-bg-color: #7f96af;\n --navbar-brand-color: #fff;\n --menu-bg-color: #fff;\n --menu-text-color: #212529;\n --menu-text-hover-bg-color: #9bb0c5;\n --menu-text-hover-color: #fff;\n --section-bg-color: #f8f9fa;\n --section-text-color: #6c757d;\n --section-bottom-color: #eee;\n --addContent-bg-color: #e9ecef;\n --addContent-text-color: #000;\n --sidebar-bg-color: #f8f9fa;\n\n --btn-bg-color: #fff;\n --btn-text-color: #495057;\n --btn-border-color: #97b0c7;\n\n --badge-tags-bg-color: #ffc107;\n --badge-tags-bg-color: #ffe1a7;\n --badge-tags-text-color: #212529;\n\n --pagination-text-color: #586069;\n --pagination-border-color: #586069;\n\n --table-bg-color: #f8f9fa;\n\n --apicard-visibility-color: #586069;\n --apicard-visibility-border-color: rgba(27,31,35,.15);\n --modal-selection-bg-color: rgba(27,31,35,.15);\n}","faviconUrl":null,"description":"A new organization to host very fine APIs","homeCmsPage":"63c67b5150010024104b0e8c","unloggedHome":"","fontFamilyUrl":null,"homePageVisible":false,"notFoundCmsPage":null,"cmsHistoryLength":10,"authenticatedCmsPage":null},"domain":"localhost","contact":"contact@foo.bar","enabled":true,"_deleted":false,"adminApi":"admin-api-tenant-default","robotTxt":null,"isPrivate":false,"tenantMode":"Default","authProvider":"Local","bucketSettings":null,"defaultMessage":null,"mailerSettings":{"host":"localhost","port":"1025","type":"smtpClient","template":null,"fromEmail":"no-reply@daikoku.io","fromTitle":"daikoku"},"defaultLanguage":"En","_humanReadableId":"evil-corp.","auditTrailConfig":{"kafkaConfig":null,"alertsEmails":[],"auditWebhooks":[],"elasticConfigs":null},"creationSecurity":false,"otoroshiSettings":[{"_id":"default","url":"http://127.0.0.1:9000/fakeotoroshi","host":"otoroshi-api.foo.bar","clientId":"admin-api-apikey-id","clientSecret":"admin-api-apikey-id"}],"adminSubscriptions":[],"authProviderSettings":{"sessionMaxAge":86400},"subscriptionSecurity":true,"apiReferenceHideForGuest":true,"thirdPartyPaymentSettings":[],"aggregationApiKeysSecurity":false}} +{"type":"tenants","payload":{"_id":"default","name":"Evil Corp.","style":{"js":"","css":"","logo":"/assets/images/daikoku.svg","jsUrl":null,"title":"Evil Corp.","cssUrl":null,"footer":null,"cacheTTL":60000,"colorTheme":":root {\n --body_bg-color: #f1f3f6;\n --body_text-color: #8a8a8a;\n --body_link-color:#4c4c4d;\n --body_link-hover-color:orange;\n \n --level2_bg-color: #e5e7ea;\n --level2_text-color: #4c4c4d;\n --level2_link-color: #605c5c;\n --level2_link-hover-color: #000; \n \n --level3_bg-color : #fff;\n --level3_text-color : #222;\n --level3_link-color: #4c4c4d;\n --level3_link-hover-color : #000;\n --level3_link-hover-bg-color :grey;\n\n --sidebar-bg-color: #e5e7ea;\n --sidebar-text-color: #4c4c4d;\n --sidebar-text-hover-color:orange;\n \n --menu-bg-color: #fff;\n --menu-text-color: #aaa;\n --menu-text-hover-bg-color: #444;\n --menu-text-hover-color: #fff;\n --menu-link-color: #666;\n \n --card_header-bg-color: #404040;\n --card_header-text-color: #fff;\n --card_bg-color: #282828;\n --card_text-color: #fff;\n --card_link-color: #ffe1a7;\n --card_link-hover-color : #ffc107;\n \n --btn-bg-color: #fff;\n --btn-text-color: #495057;\n --btn-border-color: #97b0c7;\n \n --badge-tags-bg-color: #ffc107;\n --badge-tags-bg-hover-color: #ffe1a7;\n --badge-tags-text-color: #212529; \n \n --form-text-color: #000;\n --form-border-color: #586069;\n --form-bg-color: #fff;\n\n --form-select-focused-color: lightgrey;\n --form-select-focused-text-color: white;\n --form-select-heading-color: yellow;\n --form-select-hover-color: lightgrey;\n --form-select-hover-text-color: white;\n\n --error-color:#dc3545;\n --info-color: #17a2b8;\n --success-color: #65B741;\n --warning-color: #ffc107;\n --danger-color: #dc3545; \n }\n \n :root[data-theme=\"DARK\"] { \n --body_bg-color: #000;\n --body_text-color: #b3b3b3;\n --body_link-color:#b3b3b3;\n --body_link-hover-color:orange;\n \n --level2_bg-color: #121212;\n --level2_text-color: #b3b3b3;\n --level2_link-color: #9f9e9e;\n --level2_link-hover-color: #fff;\n \n --level3_bg-color : #242424;\n --level3_text-color : #e8e8e8;\n --level3_link-color: #9f9e9e;\n --level3_link-hover-color : #fff;\n --level3_link-hover-bg-color : grey; \n \n --sidebar-bg-color: #121212;\n --sidebar-text-color: #b3b3b3;\n --sidebar-text-hover-color:orange;\n \n --menu-bg-color: #242424;\n --menu-text-color: #fff;\n --menu-text-hover-bg-color: #121212;\n --menu-text-hover-color: #fff;\n --menu-link-color: #b3b3b3; \n \n --card_header-bg-color : #404040;\n --card_header-text-color: #fff;\n --card_bg-color: #282828;\n --card_text-color: #fff;\n --card_link-color: #ffe1a7;\n --card_link-hover-color : #ffc107;\n \n --btn-bg-color: #fff;\n --btn-text-color: #495057;\n --btn-border-color: #97b0c7;\n \n --badge-tags-bg-color: #ffc107;\n --badge-tags-bg-hover-color: #ffe1a7;\n --badge-tags-text-color: #212529;\n \n --form-text-color: #000;\n --form-border-color: #586069;\n --form-bg-color: #fff;\n \n --form-select-focused-color: grey;\n --form-select-focused-text-color: white;\n --form-select-heading-color: yellow;\n --form-select-hover-color: grey;\n --form-select-hover-text-color: white; \n\n --error-color:#dc3545;\n --info-color: #17a2b8;\n --success-color: #65B741;\n --warning-color: #ffc107;\n --danger-color: #dc3545;\n }","faviconUrl":null,"description":"A new organization to host very fine APIs","homeCmsPage":"63c67b5150010024104b0e8c","unloggedHome":"","fontFamilyUrl":null,"homePageVisible":false,"notFoundCmsPage":null,"cmsHistoryLength":10,"authenticatedCmsPage":null},"domain":"localhost","contact":"contact@foo.bar","enabled":true,"_deleted":false,"adminApi":"admin-api-tenant-default","robotTxt":null,"isPrivate":false,"tenantMode":"Default","authProvider":"Local","bucketSettings":null,"defaultMessage":null,"mailerSettings":{"host":"localhost","port":"1025","type":"smtpClient","template":null,"fromEmail":"no-reply@daikoku.io","fromTitle":"daikoku"},"defaultLanguage":"En","_humanReadableId":"evil-corp.","auditTrailConfig":{"kafkaConfig":null,"alertsEmails":[],"auditWebhooks":[],"elasticConfigs":null},"creationSecurity":false,"otoroshiSettings":[{"_id":"default","url":"http://127.0.0.1:9000/fakeotoroshi","host":"otoroshi-api.foo.bar","clientId":"admin-api-apikey-id","clientSecret":"admin-api-apikey-id"}],"adminSubscriptions":[],"authProviderSettings":{"sessionMaxAge":86400},"subscriptionSecurity":true,"apiReferenceHideForGuest":true,"thirdPartyPaymentSettings":[],"aggregationApiKeysSecurity":false}} {"type":"users","payload":{"_id":"7cxa2bvog4k8e8d3uswmwnf90w9x8nea","name":"User","email":"user@foo.bar","isGuest":false,"origins":["Local"],"picture":"/assets/images/anonymous.jpg","tenants":["default"],"_deleted":false,"metadata":{},"password":"$2a$10$/Vpj1lFN0AcCfbutd7FJwO0j1vU4X0fR6t.4vvWBqSEqtoUFFxfDG","invitation":null,"lastTenant":null,"starredApis":[],"personalToken":"m775o13fduvnmpygimyyd6jpgh6ephl7","isDaikokuAdmin":false,"defaultLanguage":null,"_humanReadableId":"user-foo.bar","pictureFromProvider":true,"twoFactorAuthentication":null,"hardwareKeyRegistrations":[]}} {"type":"users","payload":{"_id":"mom9ff7opam5nv576rpo98n9sqpxag5l","name":"Tester","email":"tester@foo.bar","isGuest":false,"origins":["Local"],"picture":"https://www.gravatar.com/avatar/7075180bc9c01c6ece2925b9822b6d77?size=128&d=robohash","tenants":["default"],"_deleted":false,"metadata":{},"password":"$2a$10$/Vpj1lFN0AcCfbutd7FJwO0j1vU4X0fR6t.4vvWBqSEqtoUFFxfDG","invitation":null,"lastTenant":null,"starredApis":[],"personalToken":"z05xtwwlgf1vlj4q1xkr6j0kbdjrz8q0","isDaikokuAdmin":false,"defaultLanguage":null,"_humanReadableId":"tester-foo.bar","pictureFromProvider":true,"twoFactorAuthentication":null,"hardwareKeyRegistrations":[]}} {"type":"users","payload":{"_id":"SR9OKNdEcz1CZwe8WEMB6QYvFQPGfDTs6RXHDGYMCIva0SjEA11EOpmbMzYvBrQL","name":"Admin","email":"admin@foo.bar","isGuest":false,"origins":["Local"],"picture":"https://www.gravatar.com/avatar/87d47b53c88259042a50fa24a6d6b0f4?size=128&d=robohash","tenants":["default"],"_deleted":false,"metadata":{},"password":"$2a$10$/Vpj1lFN0AcCfbutd7FJwO0j1vU4X0fR6t.4vvWBqSEqtoUFFxfDG","invitation":null,"lastTenant":null,"starredApis":[],"personalToken":"bvBvXclSTmCmdAmEN2W03zTDwga7nKtZ","isDaikokuAdmin":true,"defaultLanguage":null,"_humanReadableId":"admin-foo.bar","pictureFromProvider":true,"twoFactorAuthentication":null,"hardwareKeyRegistrations":[]}}