mirror of
https://github.com/ilyakooo0/urbit.git
synced 2024-09-20 23:18:00 +03:00
Merge pull request #4197 from tylershuster/hark-title
interface: document title
This commit is contained in:
commit
1b96410b94
@ -1,7 +1,7 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>OS1</title>
|
<title>Landscape</title>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport"
|
<meta name="viewport"
|
||||||
content="width=device-width, initial-scale=1, shrink-to-fit=no,maximum-scale=1"/>
|
content="width=device-width, initial-scale=1, shrink-to-fit=no,maximum-scale=1"/>
|
||||||
@ -12,8 +12,8 @@
|
|||||||
<link rel="icon" type="image/png" href="/~landscape/img/Favicon.png">
|
<link rel="icon" type="image/png" href="/~landscape/img/Favicon.png">
|
||||||
<link rel="manifest"
|
<link rel="manifest"
|
||||||
href='data:application/manifest+json,{
|
href='data:application/manifest+json,{
|
||||||
"name": "OS1",
|
"name": "Landscape",
|
||||||
"short_name": "OS1",
|
"short_name": "Landscape",
|
||||||
"description": "An%20interface%20to%20your%20Urbit.",
|
"description": "An%20interface%20to%20your%20Urbit.",
|
||||||
"display": "standalone",
|
"display": "standalone",
|
||||||
"background_color": "%23FFFFFF",
|
"background_color": "%23FFFFFF",
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
|
|
||||||
<!-- <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> -->
|
<!-- <link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> -->
|
||||||
|
|
||||||
<title>OS1</title>
|
<title>Landscape</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import Helmet from 'react-helmet';
|
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
|
|
||||||
import { Box, Row, Icon, Text } from '@tlon/indigo-react';
|
import { Box, Row, Icon, Text } from '@tlon/indigo-react';
|
||||||
@ -14,6 +13,7 @@ import ModalButton from './components/ModalButton';
|
|||||||
import { writeText } from '~/logic/lib/util';
|
import { writeText } from '~/logic/lib/util';
|
||||||
import { NewGroup } from "~/views/landscape/components/NewGroup";
|
import { NewGroup } from "~/views/landscape/components/NewGroup";
|
||||||
import { JoinGroup } from "~/views/landscape/components/JoinGroup";
|
import { JoinGroup } from "~/views/landscape/components/JoinGroup";
|
||||||
|
import { Helmet } from 'react-helmet';
|
||||||
|
|
||||||
const ScrollbarLessBox = styled(Box)`
|
const ScrollbarLessBox = styled(Box)`
|
||||||
scrollbar-width: none !important;
|
scrollbar-width: none !important;
|
||||||
@ -28,8 +28,8 @@ export default function LaunchApp(props) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Helmet>
|
<Helmet defer={false}>
|
||||||
<title>OS1 - Home</title>
|
<title>{ props.notificationsCount ? `(${String(props.notificationsCount) }) `: '' }Landscape</title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<ScrollbarLessBox height='100%' overflowY='scroll'>
|
<ScrollbarLessBox height='100%' overflowY='scroll'>
|
||||||
<Welcome firstTime={props.launch.firstTime} api={props.api} />
|
<Welcome firstTime={props.launch.firstTime} api={props.api} />
|
||||||
|
@ -6,6 +6,7 @@ import ErrorBoundary from '~/views/components/ErrorBoundary';
|
|||||||
import Tile from './tile';
|
import Tile from './tile';
|
||||||
|
|
||||||
export const weatherStyleMap = {
|
export const weatherStyleMap = {
|
||||||
|
Clear: 'rgba(67, 169, 255, 0.4)',
|
||||||
Sunny: 'rgba(67, 169, 255, 0.4)',
|
Sunny: 'rgba(67, 169, 255, 0.4)',
|
||||||
PartlyCloudy: 'rgba(178, 211, 255, 0.33)',
|
PartlyCloudy: 'rgba(178, 211, 255, 0.33)',
|
||||||
Cloudy: 'rgba(136, 153, 176, 0.43)',
|
Cloudy: 'rgba(136, 153, 176, 0.43)',
|
||||||
|
@ -47,7 +47,7 @@ export default function ProfileScreen(props: any) {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Helmet defer={false}>
|
<Helmet defer={false}>
|
||||||
<title>OS1 - Profile</title>
|
<title>{ props.notificationsCount ? `(${String(props.notificationsCount) }) `: '' }Landscape - Profile</title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route
|
<Route
|
||||||
|
@ -46,8 +46,8 @@ export default class TermApp extends Component {
|
|||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Helmet>
|
<Helmet defer={false}>
|
||||||
<title>OS1 - Terminal</title>
|
<title>{ props.notificationsCount ? `(${String(this.props.notificationsCount) }) `: '' }Landscape</title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<Box
|
<Box
|
||||||
height='100%'
|
height='100%'
|
||||||
|
@ -7,6 +7,7 @@ import {
|
|||||||
} from "react-router-dom";
|
} from "react-router-dom";
|
||||||
import { Col, Box, Text } from "@tlon/indigo-react";
|
import { Col, Box, Text } from "@tlon/indigo-react";
|
||||||
import _ from "lodash";
|
import _ from "lodash";
|
||||||
|
import Helmet from 'react-helmet';
|
||||||
|
|
||||||
import { Resource } from "./Resource";
|
import { Resource } from "./Resource";
|
||||||
import { PopoverRoutes } from "./PopoverRoutes";
|
import { PopoverRoutes } from "./PopoverRoutes";
|
||||||
@ -131,11 +132,18 @@ export function GroupsPane(props: GroupsPaneProps) {
|
|||||||
const appPath = `/ship/${host}/${name}`;
|
const appPath = `/ship/${host}/${name}`;
|
||||||
const association = associations.graph[appPath];
|
const association = associations.graph[appPath];
|
||||||
const resourceUrl = `${baseUrl}/join/${app}${appPath}`;
|
const resourceUrl = `${baseUrl}/join/${app}${appPath}`;
|
||||||
|
let title = groupAssociation?.metadata?.title ?? 'Landscape';
|
||||||
|
|
||||||
if (!association) {
|
if (!association) {
|
||||||
return <Loading />;
|
return <Loading />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
title += ` - ${association.metadata.title}`;
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<Helmet defer={false}>
|
||||||
|
<title>{props.notificationsCount ? `(${String(props.notificationsCount)}) ` : ''}{ title }</title>
|
||||||
|
</Helmet>
|
||||||
<Skeleton
|
<Skeleton
|
||||||
recentGroups={recentGroups}
|
recentGroups={recentGroups}
|
||||||
mobileHide
|
mobileHide
|
||||||
@ -153,6 +161,7 @@ export function GroupsPane(props: GroupsPaneProps) {
|
|||||||
/>
|
/>
|
||||||
{popovers(routeProps, resourceUrl)}
|
{popovers(routeProps, resourceUrl)}
|
||||||
</Skeleton>
|
</Skeleton>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
@ -184,7 +193,12 @@ export function GroupsPane(props: GroupsPaneProps) {
|
|||||||
const hasDescription = groupAssociation?.metadata?.description;
|
const hasDescription = groupAssociation?.metadata?.description;
|
||||||
const description = (hasDescription && hasDescription !== "")
|
const description = (hasDescription && hasDescription !== "")
|
||||||
? hasDescription : "Create or select a channel to get started"
|
? hasDescription : "Create or select a channel to get started"
|
||||||
|
const title = groupAssociation?.metadata?.title ?? 'Landscape';
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<Helmet defer={false}>
|
||||||
|
<title>{props.notificationsCount ? `(${String(props.notificationsCount)}) ` : ''}{ title }</title>
|
||||||
|
</Helmet>
|
||||||
<Skeleton recentGroups={recentGroups} {...props} baseUrl={baseUrl}>
|
<Skeleton recentGroups={recentGroups} {...props} baseUrl={baseUrl}>
|
||||||
<Col
|
<Col
|
||||||
alignItems="center"
|
alignItems="center"
|
||||||
@ -198,6 +212,7 @@ export function GroupsPane(props: GroupsPaneProps) {
|
|||||||
</Col>
|
</Col>
|
||||||
{popovers(routeProps, baseUrl)}
|
{popovers(routeProps, baseUrl)}
|
||||||
</Skeleton>
|
</Skeleton>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import React, { useCallback } from "react";
|
import React, { useCallback } from "react";
|
||||||
import { Row, Box, Col } from "@tlon/indigo-react";
|
import { Row, Box, Col } from "@tlon/indigo-react";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
import { Link } from "react-router-dom";
|
import Helmet from 'react-helmet';
|
||||||
|
|
||||||
import { ChatResource } from "~/views/apps/chat/ChatResource";
|
import { ChatResource } from "~/views/apps/chat/ChatResource";
|
||||||
import { PublishResource } from "~/views/apps/publish/PublishResource";
|
import { PublishResource } from "~/views/apps/publish/PublishResource";
|
||||||
@ -34,7 +34,17 @@ export function Resource(props: ResourceProps) {
|
|||||||
const relativePath = (p: string) =>
|
const relativePath = (p: string) =>
|
||||||
`${props.baseUrl}/resource/${app}${appPath}${p}`;
|
`${props.baseUrl}/resource/${app}${appPath}${p}`;
|
||||||
const skelProps = { api, association };
|
const skelProps = { api, association };
|
||||||
|
let title = props.association.metadata.title;
|
||||||
|
if ('workspace' in props) {
|
||||||
|
if ('group' in props.workspace && props.workspace.group in props.associations.contacts) {
|
||||||
|
title = `${props.associations.contacts[props.workspace.group].metadata.title} - ${props.association.metadata.title}`;
|
||||||
|
}
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<Helmet defer={false}>
|
||||||
|
<title>{props.notificationsCount ? `(${String(props.notificationsCount)}) ` : ''}{ title }</title>
|
||||||
|
</Helmet>
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route
|
<Route
|
||||||
path={relativePath("/settings")}
|
path={relativePath("/settings")}
|
||||||
@ -76,5 +86,6 @@ export function Resource(props: ResourceProps) {
|
|||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
</Switch>
|
</Switch>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import React, { Component, useEffect, useCallback } from 'react';
|
import React, { Component, useEffect, useCallback } from 'react';
|
||||||
import { Route, Switch, RouteComponentProps } from 'react-router-dom';
|
import { Route, Switch, RouteComponentProps } from 'react-router-dom';
|
||||||
|
import Helmet from 'react-helmet';
|
||||||
|
|
||||||
import './css/custom.css';
|
import './css/custom.css';
|
||||||
|
|
||||||
@ -67,8 +68,6 @@ export function DMRedirect(props: LandscapeProps & RouteComponentProps & { ship:
|
|||||||
|
|
||||||
export default class Landscape extends Component<LandscapeProps, {}> {
|
export default class Landscape extends Component<LandscapeProps, {}> {
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
document.title = 'OS1 - Landscape';
|
|
||||||
|
|
||||||
this.props.subscription.startApp('groups');
|
this.props.subscription.startApp('groups');
|
||||||
this.props.subscription.startApp('graph');
|
this.props.subscription.startApp('graph');
|
||||||
}
|
}
|
||||||
@ -78,6 +77,10 @@ export default class Landscape extends Component<LandscapeProps, {}> {
|
|||||||
const { api } = props;
|
const { api } = props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
|
<Helmet defer={false}>
|
||||||
|
<title>{ props.notificationsCount ? `(${String(props.notificationsCount) }) `: '' }Landscape</title>
|
||||||
|
</Helmet>
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route path="/~landscape/ship/:host/:name"
|
<Route path="/~landscape/ship/:host/:name"
|
||||||
render={routeProps => {
|
render={routeProps => {
|
||||||
@ -143,6 +146,7 @@ export default class Landscape extends Component<LandscapeProps, {}> {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Switch>
|
</Switch>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user