empayre/fleet
14
0
Fork 0
mirror of https://github.com/empayre/fleet.git synced 2024-11-06 00:45:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fleet UI: Update page titles (#15983)

Browse Source
This commit is contained in:
RachelElysia 2024-01-12 09:27:56 -05:00 committed by GitHub
parent de2abafbbb
commit 5ae52b3a0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 62 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
changes/15902-update-page-titles Normal file
View File

@ -0,0 +1 @@
- Clearer browser page titles

9
frontend/components/App/App.tsx
View File

@ -24,7 +24,6 @@ import Fleet404 from "pages/errors/Fleet404";
import Fleet500 from "pages/errors/Fleet500";
import Spinner from "components/Spinner";
import { QueryParams } from "utilities/url";
import { DOCUMENT_TITLE_SUFFIX } from "utilities/constants";
interface IAppProps {
children: JSX.Element;
@ -119,14 +118,6 @@ const App = ({ children, location }: IAppProps): JSX.Element => {
location?.pathname.includes(item.path)
);
// Override Controls page title if MDM not configured
if (
!config?.mdm.enabled_and_configured &&
curTitle?.path === "/controls/os-updates"
) {
curTitle.title = `Manage OS hosts | ${DOCUMENT_TITLE_SUFFIX}`;
}
if (curTitle && curTitle.title) {
document.title = curTitle.title;
}

18
frontend/pages/hosts/details/DeviceUserPage/DeviceUserPage.tsx
View File

@ -294,23 +294,7 @@ const DeviceUserPage = ({
// Updates title that shows up on browser tabs
useEffect(() => {
const hostTab = () => {
if (location.pathname.includes("software")) {
return "software";
}
if (location.pathname.includes("schedule")) {
return "schedule";
}
if (location.pathname.includes("policies")) {
return "policies";
}
return "";
};
// e.g., Rachel's Macbook Pro schedule details | Fleet for osquery
document.title = `My device ${hostTab()} details | ${
host?.display_name || "Unknown host"
} | ${DOCUMENT_TITLE_SUFFIX}`;
document.title = `My device | ${DOCUMENT_TITLE_SUFFIX}`;
}, [location.pathname, host]);
const renderActionButtons = () => {

23
frontend/pages/hosts/details/HostDetailsPage/HostDetailsPage.tsx
View File

@ -345,23 +345,12 @@ const HostDetailsPage = ({
// Updates title that shows up on browser tabs
useEffect(() => {
const hostTab = () => {
if (location.pathname.includes("software")) {
return "software";
}
if (location.pathname.includes("schedule")) {
return "schedule";
}
if (location.pathname.includes("policies")) {
return "policies";
}
return "";
};
// e.g., Rachel's Macbook Pro schedule details | Fleet for osquery
document.title = `Host ${hostTab()} details ${
host?.display_name ? `| ${host?.display_name} |` : "|"
} ${DOCUMENT_TITLE_SUFFIX}`;
if (host?.display_name) {
// e.g., Rachel's Macbook Pro | Hosts | Fleet
document.title = `${host?.display_name} | Hosts | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Hosts | ${DOCUMENT_TITLE_SUFFIX}`;
}
}, [location.pathname, host]);
// Used for back to software pathname

9
frontend/pages/hosts/details/HostQueryReport/HostQueryReport.tsx
View File

@ -95,7 +95,14 @@ const HostQueryReport = ({
router.push(PATHS.HOST_QUERIES(hostId));
}
document.title = `Host query report | ${queryName} | ${hostName} | ${DOCUMENT_TITLE_SUFFIX}`;
// Updates title that shows up on browser tabs
if (queryName && hostName) {
// e.g., Discover TLS certificates (Rachel's MacBook Pro) | Hosts | Fleet
document.title = `${queryName} (${hostName}) |
Hosts | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Hosts | ${DOCUMENT_TITLE_SUFFIX}`;
}
const HQRHeader = useCallback(() => {
const fullReportPath = PATHS.QUERY_DETAILS(queryId);

8
frontend/pages/policies/PolicyPage/PolicyPage.tsx
View File

@ -206,8 +206,12 @@ const PolicyPage = ({
// Updates title that shows up on browser tabs
useEffect(() => {
// e.g., Policy details | Antivirus healthy (Linux) | Fleet for osquery
document.title = `Policy details | ${storedPolicy?.name} | ${DOCUMENT_TITLE_SUFFIX}`;
// e.g., Antivirus healthy (Linux) | Policies | Fleet
if (storedPolicy?.name) {
document.title = `${storedPolicy.name} | Policies | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Policies | ${DOCUMENT_TITLE_SUFFIX}`;
}
}, [location.pathname, storedPolicy?.name]);
useEffect(() => {

21
frontend/pages/queries/details/QueryDetailsPage/QueryDetailsPage.tsx
View File

@ -17,11 +17,11 @@ import { IQueryReport } from "interfaces/query_report";
import queryAPI from "services/entities/queries";
import queryReportAPI, { ISortOption } from "services/entities/query_report";
import { DOCUMENT_TITLE_SUFFIX } from "utilities/constants";
import {
isGlobalObserver,
isTeamObserver,
} from "utilities/permissions/permissions";
import { DOCUMENT_TITLE_SUFFIX } from "utilities/constants";
import Spinner from "components/Spinner/Spinner";
import Button from "components/buttons/Button";
@ -109,15 +109,6 @@ const QueryDetailsPage = ({
setLastEditedQueryDiscardData,
} = useContext(QueryContext);
// Title that shows up on browser tabs (e.g., Query details | Discover TLS certificates | Fleet for osquery)
useEffect(() => {
const queryNameCopy = lastEditedQueryName
? `${lastEditedQueryName} | `
: "";
document.title = `Query details | ${queryNameCopy}${DOCUMENT_TITLE_SUFFIX}`;
}, [lastEditedQueryName]);
const [disabledCachingGlobally, setDisabledCachingGlobally] = useState(true);
useEffect(() => {
@ -183,6 +174,16 @@ const QueryDetailsPage = ({
}
}, [storedQuery]);
// Updates title that shows up on browser tabs
useEffect(() => {
// e.g., Discover TLS certificates | Queries | Fleet
if (storedQuery?.name) {
document.title = `${storedQuery.name} | Queries | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Queries | ${DOCUMENT_TITLE_SUFFIX}`;
}
}, [location.pathname, storedQuery?.name]);
const isLoading = isStoredQueryLoading || isQueryReportLoading;
const isApiError = storedQueryError || queryReportError;
const isClipped =

12
frontend/pages/queries/edit/EditQueryPage.tsx
View File

@ -202,12 +202,12 @@ const EditQueryPage = ({
// Updates title that shows up on browser tabs
useEffect(() => {
// e.g., Query details | Discover TLS certificates | Fleet for osquery
const storedQueryTitleCopy = storedQuery?.name
? `${storedQuery.name} | `
: "";
document.title = `Edit query | ${storedQueryTitleCopy} ${DOCUMENT_TITLE_SUFFIX}`;
// }
// e.g., Editing Discover TLS certificates | Queries | Fleet
if (storedQuery?.name) {
document.title = `Editing ${storedQuery.name} | Queries | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Queries | ${DOCUMENT_TITLE_SUFFIX}`;
}
}, [location.pathname, storedQuery?.name]);
useEffect(() => {

9
frontend/pages/queries/live/LiveQueryPage/LiveQueryPage.tsx
View File

@ -138,9 +138,12 @@ const RunQueryPage = ({
// Updates title that shows up on browser tabs
useEffect(() => {
const queryNameCopy = storedQuery?.name ? `${storedQuery?.name} | ` : "";
// e.g., Run live query | Discover TLS certificates | Fleet for osquery
document.title = `Run live query | ${queryNameCopy}${DOCUMENT_TITLE_SUFFIX}`;
// e.g., Run Discover TLS certificates | Queries | Fleet
if (storedQuery?.name) {
document.title = `Run ${storedQuery.name} | Queries | ${DOCUMENT_TITLE_SUFFIX}`;
} else {
document.title = `Queries | ${DOCUMENT_TITLE_SUFFIX}`;
}
}, [location.pathname, storedQuery?.name]);
const goToQueryEditor = useCallback(

56
frontend/router/page_titles.ts
View File

@ -6,67 +6,31 @@ import PATHS from "router/paths";
// Note: Order matters for use of array.find() (specific subpaths must be listed before their parent path)
export default [
{ path: PATHS.DASHBOARD, title: `Dashboard | ${DOCUMENT_TITLE_SUFFIX}` },
{ path: "/hosts/manage", title: `Manage hosts | ${DOCUMENT_TITLE_SUFFIX}` },
{ path: PATHS.MANAGE_HOSTS, title: `Hosts | ${DOCUMENT_TITLE_SUFFIX}` },
{
path: PATHS.CONTROLS_OS_UPDATES,
title: `Manage OS updates | ${DOCUMENT_TITLE_SUFFIX}`,
path: PATHS.CONTROLS,
title: `Controls | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.CONTROLS_OS_SETTINGS,
title: `Manage OS settings | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.CONTROLS_SETUP_EXPERIENCE,
title: `Manage setup experience | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.SOFTWARE_TITLES,
title: `Software titles | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.SOFTWARE_VERSIONS,
title: `Software versions | ${DOCUMENT_TITLE_SUFFIX}`,
path: PATHS.SOFTWARE,
title: `Software | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.MANAGE_QUERIES,
title: `Manage queries | ${DOCUMENT_TITLE_SUFFIX}`,
title: `Queries | ${DOCUMENT_TITLE_SUFFIX}`,
},
{ path: PATHS.NEW_QUERY(), title: `New query | ${DOCUMENT_TITLE_SUFFIX}` },
{
path: PATHS.MANAGE_POLICIES,
title: `Manage policies | ${DOCUMENT_TITLE_SUFFIX}`,
title: `Policies | ${DOCUMENT_TITLE_SUFFIX}`,
},
{ path: PATHS.NEW_POLICY, title: `New policy | ${DOCUMENT_TITLE_SUFFIX}` },
{
path: PATHS.ADMIN_ORGANIZATION,
title: `Manage organization settings | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.ADMIN_INTEGRATIONS,
title: `Manage integration settings | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.ADMIN_USERS,
title: `Manage user settings | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: "/settings/teams/members",
// TODO
// path: PATHS.TEAM_DETAILS_MEMBERS(), needs params
title: `Manage team members | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: "/settings/teams/options",
// TODO
// path: PATHS.TEAM_DETAILS_OPTIONS(), needs params
title: `Manage team options | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.ADMIN_TEAMS,
title: `Manage team settings | ${DOCUMENT_TITLE_SUFFIX}`,
path: PATHS.ADMIN_SETTINGS,
title: `Settings | ${DOCUMENT_TITLE_SUFFIX}`,
},
{
path: PATHS.USER_SETTINGS,
title: `Manage my account | ${DOCUMENT_TITLE_SUFFIX}`,
title: `Settings | My account | ${DOCUMENT_TITLE_SUFFIX}`,
},
];

2
frontend/router/paths.ts
View File

@ -23,6 +23,7 @@ export default {
DASHBOARD_CHROME: `${URL_PREFIX}/dashboard/chrome`,
// Admin pages
ADMIN_SETTINGS: `${URL_PREFIX}/settings`,
ADMIN_USERS: `${URL_PREFIX}/settings/users`,
ADMIN_INTEGRATIONS: `${URL_PREFIX}/settings/integrations`,
ADMIN_INTEGRATIONS_TICKET_DESTINATIONS: `${URL_PREFIX}/settings/integrations/ticket-destinations`,
@ -44,6 +45,7 @@ export default {
ADMIN_ORGANIZATION_FLEET_DESKTOP: `${URL_PREFIX}/settings/organization/fleet-desktop`,
// Software pages
SOFTWARE: `${URL_PREFIX}/software`,
SOFTWARE_TITLES: `${URL_PREFIX}/software/titles`,
SOFTWARE_VERSIONS: `${URL_PREFIX}/software/versions`,
SOFTWARE_TITLE_DETAILS: (id: string): string => {

2
frontend/templates/react.ejs
View File

@ -63,7 +63,7 @@
/>
<link rel="shortcut icon" href="{{.URLPrefix}}/assets/favicon.ico" />
<title>Fleet for osquery</title>
<title>Fleet</title>
<script type="text/javascript">
var urlPrefix = "{{.URLPrefix}}";
</script>

2
frontend/utilities/constants.tsx
View File

@ -303,4 +303,4 @@ export const EMPTY_AGENT_OPTIONS = {
export const DEFAULT_EMPTY_CELL_VALUE = "---";
export const DOCUMENT_TITLE_SUFFIX = "Fleet for osquery";
export const DOCUMENT_TITLE_SUFFIX = "Fleet";

2
website/api/controllers/docs/view-basic-documentation.js vendored
View File

@ -69,7 +69,7 @@ module.exports = {
compiledPagePartialsAppPath: sails.config.builtStaticContent.compiledPagePartialsAppPath,
pageTitleForMeta: (
thisPage.title !== 'Readme.md' ? thisPage.title + ' | Fleet documentation'// « custom meta title for this page, if provided in markdown
: 'Documentation | Fleet for osquery' // « otherwise we're on the landing page for this section of the site, so we'll follow the title format of other top-level pages
: 'Documentation | Fleet' // « otherwise we're on the landing page for this section of the site, so we'll follow the title format of other top-level pages
),
pageDescriptionForMeta: (
thisPage.meta.description ? thisPage.meta.description // « custom meta description for this page, if provided in markdown

2
website/api/controllers/download-rss-feed.js vendored
View File

@ -87,7 +87,7 @@ module.exports = {
categoryDescription = '';
break;
case 'articles':
articleCategoryTitle = 'Fleet blog | Fleet for osquery';
articleCategoryTitle = 'Fleet blog | Fleet';
categoryDescription = 'Read all articles from Fleet\'s blog.';
}

2
website/api/controllers/handbook/view-basic-handbook.js vendored
View File

@ -64,7 +64,7 @@ module.exports = {
compiledPagePartialsAppPath: sails.config.builtStaticContent.compiledPagePartialsAppPath,
pageTitleForMeta: (
thisPage.title !== 'Readme.md' ? thisPage.title + ' | Fleet handbook'// « custom meta title for this page, if provided in markdown
: 'Handbook | Fleet for osquery' // « otherwise we're on the landing page for this section of the site, so we'll follow the title format of other top-level pages
: 'Handbook | Fleet' // « otherwise we're on the landing page for this section of the site, so we'll follow the title format of other top-level pages
),
pageDescriptionForMeta: (
thisPage.meta.description ? thisPage.meta.description // « custom meta description for this page, if provided in markdown