Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit f3aec70

Browse files
ui: add auto page meta updating
1 parent 343aab1 commit f3aec70

File tree

6 files changed

+60
-31
lines changed

6 files changed

+60
-31
lines changed

‎apps/client/auto-imports.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ declare global {
6666
const useCssVars: typeof import('vue')['useCssVars']
6767
const useDialogPluginComponent: typeof import('quasar')['useDialogPluginComponent']
6868
const useLink: typeof import('vue-router')['useLink']
69-
const useMeta: typeof import('quasar')['useMeta']
69+
const useMeta: typeof import('src/code/utils/use-meta')['useMeta']
7070
const useQuasar: typeof import('quasar')['useQuasar']
7171
const useRoute: typeof import('vue-router')['useRoute']
7272
const useRouter: typeof import('vue-router')['useRouter']

‎apps/client/index.html

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,6 @@
1616
/>
1717

1818
<!-- Primary Meta Tags -->
19-
<meta
20-
name="description"
21-
content="DeepNotes is an open source, end-to-end encrypted infinite canvas tool with deep page nesting and realtime collaboration. Create mind maps, diagrams, kanban boards, and more."
22-
/>
2319
<meta
2420
name="keywords"
2521
content="deepnotes, deep notes, infinite canvas, nested, mind map, note-taking, visual, spatial, end-to-end encrypted, collaborative, realtime collaboration, realtime collaboration, open source"
@@ -44,18 +40,6 @@
4440
property="og:type"
4541
content="website"
4642
/>
47-
<meta
48-
property="og:url"
49-
content="https://deepnotes.app/"
50-
/>
51-
<meta
52-
property="og:title"
53-
content="DeepNotes - Deeply-Nested Infinite Canvases"
54-
/>
55-
<meta
56-
property="og:description"
57-
content="DeepNotes is an open source, end-to-end encrypted infinite canvas tool with deep page nesting and realtime collaboration."
58-
/>
5943
<meta
6044
property="og:image"
6145
content="/meta-image.png"
@@ -66,18 +50,6 @@
6650
property="twitter:card"
6751
content="summary_large_image"
6852
/>
69-
<meta
70-
property="twitter:url"
71-
content="https://deepnotes.app/"
72-
/>
73-
<meta
74-
property="twitter:title"
75-
content="DeepNotes - Deeply-Nested Infinite Canvases"
76-
/>
77-
<meta
78-
property="twitter:description"
79-
content="DeepNotes is an open source, end-to-end encrypted infinite canvas tool with deep page nesting and realtime collaboration."
80-
/>
8153
<meta
8254
property="twitter:image"
8355
content="/meta-image.png"

‎apps/client/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@deepnotes/client",
3-
"description": "DeepNotes",
3+
"description": "DeepNotes is an open source, end-to-end encrypted infinite canvas tool with deep page nesting and realtime collaboration. Create mind maps, diagrams, kanban boards, and more.",
44
"homepage": "https://deepnotes.app",
55
"version": "1.0.22",
66
"author": "Gustavo Toyota <gustavottoyota@gmail.com>",

‎apps/client/quasar.config.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -162,13 +162,14 @@ module.exports = configure(function (ctx) {
162162
],
163163
'src/code/helpers': ['router', 'route', '$quasar'],
164164

165+
'src/code/utils/use-meta': ['useMeta'],
166+
165167
'src/components/CustomDialog.vue': [['default', 'CustomDialog']],
166168

167169
quasar: [
168170
'useQuasar',
169171
'Notify',
170172
'Cookies',
171-
'useMeta',
172173
'Dialog',
173174
'useDialogPluginComponent',
174175
],

‎apps/client/src/App.vue

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,14 @@ import { isCtrlDown } from './code/utils/misc';
1111
1212
useMeta(() => ({
1313
title: 'DeepNotes - Deeply-Nested Infinite Canvases',
14+
15+
meta: {
16+
description: {
17+
name: 'description',
18+
content:
19+
'DeepNotes is an open source, end-to-end encrypted infinite canvas tool with deep page nesting and realtime collaboration. Create mind maps, diagrams, kanban boards, and more.',
20+
},
21+
},
1422
}));
1523
1624
onMounted(() => {

‎apps/client/src/code/utils/use-meta.ts

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import { isString } from 'lodash';
2+
import { useMeta as _useMeta } from 'quasar';
3+
import type { MetaOptions } from 'quasar/dist/types/meta';
4+
5+
export function useMeta(options: MetaOptions | (() => MetaOptions)) {
6+
const optionsFunc = typeof options === 'function' ? options : () => options;
7+
8+
const route = useRoute();
9+
10+
_useMeta(() => {
11+
const optionsObj = optionsFunc();
12+
13+
optionsObj.meta ??= {};
14+
15+
optionsObj.meta['og:url'] = {
16+
name: 'og:url',
17+
content: `https://deepnotes.app${route.fullPath}`,
18+
};
19+
optionsObj.meta['twitter:url'] = {
20+
name: 'twitter:url',
21+
content: `https://deepnotes.app${route.fullPath}`,
22+
};
23+
24+
if (isString(optionsObj.title)) {
25+
optionsObj.meta['og:title'] = {
26+
name: 'og:title',
27+
content: optionsObj.title,
28+
};
29+
optionsObj.meta['twitter:title'] = {
30+
name: 'twitter:title',
31+
content: optionsObj.title,
32+
};
33+
}
34+
35+
if (isString(optionsObj.meta?.description?.content)) {
36+
optionsObj.meta['og:description'] = {
37+
name: 'og:description',
38+
content: optionsObj.meta.description.content,
39+
};
40+
optionsObj.meta['twitter:description'] = {
41+
name: 'twitter:description',
42+
content: optionsObj.meta.description.content,
43+
};
44+
}
45+
46+
return optionsObj;
47+
});
48+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /