github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-03 03:00:39 -04:00
Code Issues Packages Projects Releases Wiki Activity

Convert sidebar help to info

Browse Source
This commit is contained in:
Ben Haynes
2020-08-17 18:20:24 -04:00
parent b68f098450
commit 799a5dc5d9
24 changed files with 81 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/src/lang/en-US/index.json
View File

@@ -760,19 +760,19 @@
"keep_editing": "Keep Editing",
"page_help_collections_overview": "**Collections Overview** — Lists of all collections you have access to.",
"page_help_collections_browse": "**Browse Items** — Lists all {collection} items you have access to. Customize layout, filters, and sorting to tailor your view, and even save bookmarks of these different configurations for quick access.<br><br><a href='https://docs.directus.io/guides/user-guide.html#items' target='_blank'>Learn More</a>",
"page_help_collections_browse": "**Browse Items** — Lists all {collection} items you have access to. Customize layout, filters, and sorting to tailor your view, and even save bookmarks of these different configurations for quick access.",
"page_help_collections_detail": "**Item Detail** — A form for viewing and managing this item. This sidebar also contains a full history of revisions, and embedded comments.",
"page_help_activity_browse": "**Browse Activity** — A comprehensive listing of all your user's system and content activity.",
"page_help_activity_detail": "**Activity Detail** — Shows accountability info, revision data, and the update message for this activity record.",
"page_help_files_browse": "**File Library** — Lists all file assets uploaded to this project. Customize layout, filters, and sorting to tailor your view, and even save bookmarks of these different configurations for quick access.",
"page_help_files_detail": "**File Detail** — A form for managing file metadata, editing the original asset, and updating access settings.",
"page_help_settings_project": "**Project Settings** — Your project's global configuration options.<br><br><a href='https://docs.directus.io/guides/admin-guide.html#global-settings' target='_blank'>Learn More</a>",
"page_help_settings_project": "**Project Settings** — Your project's global configuration options.",
"page_help_settings_datamodel_collections": "**Data Model: Collections** — Lists all collections available. This includes visible, hidden, and system collections, as well as unmanaged database tables that can be added.",
"page_help_settings_datamodel_fields": "**Data Model: Collection** — A form for managing this collection and its fields.",
"page_help_settings_roles_browse": "**Browse Roles** — Lists the Admin, Public and custom User Roles.",
"page_help_settings_roles_detail": "**Role Detail** — Manage a role's permissions and other settings.",
"page_help_settings_presets_browse": "**Browse Presets** — Lists all presets in the project, including: user, role, and global bookmarks, as well as default views.",
"page_help_settings_presets_detail": "**Preset Detail** — A form for managing bookmarks and default collection presets.<br><br>To create a default preset, choose a role... TK TK",
"page_help_settings_presets_detail": "**Preset Detail** — A form for managing bookmarks and default collection presets.",
"page_help_settings_webhooks_browse": "**Browse Webhooks** — Lists all webhooks within the project.",
"page_help_settings_webhooks_detail": "**Webhook Detail** — A form for creating and managing project webhooks.",
"page_help_users_browse": "**User Directory** — Lists all system users within this project.",

5
app/src/modules/activity/routes/browse/browse.vue
View File

@@ -34,13 +34,10 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_activity_browse'))" />
<div class="page-description" v-html="marked($t('page_help_activity_browse'))" />
</drawer-detail>
<layout-drawer-detail @input="viewType = $event" :value="viewType" />
<portal-target name="drawer" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_activity_browse'))" />
</drawer-detail>
</template>
</private-view>
</template>

9
app/src/modules/collections/routes/browse/browse.vue
View File

@@ -138,13 +138,8 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
Page Info Here...
</drawer-detail>
<layout-drawer-detail @input="viewType = $event" :value="viewType" />
<portal-target name="drawer" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div
class="format-markdown"
class="page-description"
v-html="
marked(
$t('page_help_collections_browse', {
@@ -154,6 +149,8 @@
"
/>
</drawer-detail>
<layout-drawer-detail @input="viewType = $event" :value="viewType" />
<portal-target name="drawer" />
</template>
</private-view>
</template>

5
app/src/modules/collections/routes/detail/detail.vue
View File

@@ -152,7 +152,7 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_collections_detail'))" />
<div class="page-description" v-html="marked($t('page_help_collections_detail'))" />
</drawer-detail>
<revisions-drawer-detail
v-if="collectionInfo.meta.singleton === false && isBatch === false && isNew === false"
@@ -166,9 +166,6 @@
:collection="collection"
:primary-key="primaryKey"
/>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_collections_detail'))" />
</drawer-detail>
</template>
</private-view>
</template>

5
app/src/modules/collections/routes/overview/overview.vue
View File

@@ -30,10 +30,7 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_collections_overview'))" />
</drawer-detail>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_collections_overview'))" />
<div class="page-description" v-html="marked($t('page_help_collections_overview'))" />
</drawer-detail>
</template>
</private-view>

5
app/src/modules/files/routes/browse/browse.vue
View File

@@ -128,13 +128,10 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_files_browse'))" />
<div class="page-description" v-html="marked($t('page_help_files_browse'))" />
</drawer-detail>
<layout-drawer-detail @input="viewType = $event" :value="viewType" />
<portal-target name="drawer" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_files_browse'))" />
</drawer-detail>
</template>
</private-view>
</template>

8
app/src/modules/files/routes/detail/components/file-info-drawer-detail.vue
View File

@@ -86,6 +86,11 @@
</div>
</template>
</dl>
<v-divider />
<div class="page-description" v-html="marked($t('page_help_files_detail'))" />
</drawer-detail>
</template>
@@ -94,6 +99,7 @@ import { defineComponent, computed, ref, watch } from '@vue/composition-api';
import readableMimeType from '@/utils/readable-mime-type';
import bytes from 'bytes';
import i18n from '@/lang';
import marked from 'marked';
import localizedFormat from '@/utils/localized-format';
import api from '@/api';
@@ -122,7 +128,7 @@ export default defineComponent({
const { user } = useUser();
const { folder } = useFolder();
return { readableMimeType, size, creationDate, user, folder };
return { readableMimeType, size, creationDate, user, folder, marked };
function useCreationDate() {
const creationDate = ref<string | null>(null);

5
app/src/modules/files/routes/detail/detail.vue
View File

@@ -163,9 +163,6 @@
collection="directus_files"
:primary-key="primaryKey"
/>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_files_detail'))" />
</drawer-detail>
</template>
</private-view>
</template>
@@ -186,7 +183,6 @@ import FileLightbox from '@/views/private/components/file-lightbox';
import { useFieldsStore } from '@/stores/';
import { Field } from '@/types';
import FileInfoDrawerDetail from './components/file-info-drawer-detail.vue';
import marked from 'marked';
import useFormFields from '@/composables/use-form-fields';
import FolderPicker from '../../components/folder-picker';
import api from '@/api';
@@ -315,7 +311,6 @@ export default defineComponent({
previewActive,
revisionsDrawerDetail,
formFields,
marked,
confirmLeave,
leaveTo,
discardAndLeave,

5
app/src/modules/settings/routes/data-model/collections/collections.vue
View File

@@ -77,12 +77,9 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_settings_datamodel_collections'))" />
<div class="page-description" v-html="marked($t('page_help_settings_datamodel_collections'))" />
</drawer-detail>
<collections-filter v-model="activeTypes" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_datamodel_collections'))" />
</drawer-detail>
</template>
</private-view>
</template>

5
app/src/modules/settings/routes/data-model/fields/fields.vue
View File

@@ -75,10 +75,7 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_settings_datamodel_fields'))" />
</drawer-detail>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_datamodel_fields'))" />
<div class="page-description" v-html="marked($t('page_help_settings_datamodel_fields'))" />
</drawer-detail>
</template>
</private-view>

5
app/src/modules/settings/routes/presets/browse/browse.vue
View File

@@ -86,9 +86,6 @@
<template #drawer>
<presets-info-drawer-detail />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_presets_browse'))" />
</drawer-detail>
</template>
</private-view>
</template>
@@ -105,7 +102,6 @@ import layouts from '@/layouts';
import { TranslateResult } from 'vue-i18n';
import router from '@/router';
import ValueNull from '@/views/private/components/value-null';
import marked from 'marked';
import PresetsInfoDrawerDetail from './components/presets-info-drawer-detail.vue';
type PresetRaw = {
@@ -152,7 +148,6 @@ export default defineComponent({
confirmDelete,
deleting,
deleteSelection,
marked,
};
function useLinks() {

14
app/src/modules/settings/routes/presets/browse/components/presets-info-drawer-detail.vue
View File

@@ -10,12 +10,18 @@
<dd>{{ presetsCount }}</dd>
</div>
</dl>
<v-divider />
<div class="page-description" v-html="marked($t('page_help_settings_presets_browse'))" />
</drawer-detail>
</template>
<script lang="ts">
import { defineComponent, ref } from '@vue/composition-api';
import api from '@/api';
import marked from 'marked';
export default defineComponent({
setup() {
@@ -26,7 +32,7 @@ export default defineComponent({
fetchCounts();
return { bookmarksCount, presetsCount };
return { bookmarksCount, presetsCount, marked };
async function fetchCounts() {
loading.value = true;
@@ -51,3 +57,9 @@ export default defineComponent({
},
});
</script>
<style lang="scss" scoped>
.v-divider {
margin: 20px 0;
}
</style>

6
app/src/modules/settings/routes/presets/detail/detail.vue
View File

@@ -77,16 +77,12 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<span class="subdued">{{ $t('no_additional_info') }}</span>
<div class="page-description" v-html="marked($t('page_help_settings_presets_detail'))" />
</drawer-detail>
<div class="layout-drawer">
<portal-target name="drawer" />
</div>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_presets_detail'))" />
</drawer-detail>
</template>
</private-view>
</template>

13
app/src/modules/settings/routes/project/components/project-info-drawer-detail.vue
View File

@@ -30,12 +30,17 @@
<dd>3306</dd>
</div>
</dl>
<v-divider />
<div class="page-description" v-html="marked($t('page_help_settings_project'))" />
</drawer-detail>
</template>
<script lang="ts">
import { defineComponent } from '@vue/composition-api';
import i18n from '@/lang';
import marked from 'marked';
import { version } from '../../../../../../package.json';
import bytes from 'bytes';
@@ -47,7 +52,13 @@ import bytes from 'bytes';
export default defineComponent({
setup() {
return { version, project: {}, bytes };
return { version, project: {}, bytes, marked };
},
});
</script>
<style lang="scss" scoped>
.v-divider {
margin: 20px 0;
}
</style>

6
app/src/modules/settings/routes/project/project.vue
View File

@@ -23,9 +23,6 @@
<template #drawer>
<project-info-drawer-detail />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_project'))" />
</drawer-detail>
</template>
</private-view>
</template>
@@ -35,7 +32,6 @@ import { defineComponent, ref, computed } from '@vue/composition-api';
import SettingsNavigation from '../../components/navigation/';
import useCollection from '@/composables/use-collection';
import { useSettingsStore } from '@/stores';
import marked from 'marked';
import ProjectInfoDrawerDetail from './components/project-info-drawer-detail.vue';
import { clone } from 'lodash';
@@ -54,7 +50,7 @@ export default defineComponent({
const saving = ref(false);
return { fields, initialValues, edits, noEdits, saving, save, marked };
return { fields, initialValues, edits, noEdits, saving, save };
async function save() {
if (edits.value === null) return;

11
app/src/modules/settings/routes/roles/browse/browse.vue
View File

@@ -20,11 +20,7 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<span class="subdued">{{ $t('no_additional_info') }}</span>
</drawer-detail>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_collections_overview'))" />
<div class="page-description" v-html="marked($t('page_help_settings_roles_browse'))" />
</drawer-detail>
</template>
@@ -159,11 +155,6 @@ export default defineComponent({
--v-button-background-color-disabled: var(--warning-25);
}
.subdued {
color: var(--foreground-subdued);
font-style: italic;
}
.roles {
padding: var(--content-padding);
padding-bottom: var(--content-padding-bottom);

14
app/src/modules/settings/routes/roles/detail/components/role-info-drawer-detail/role-info-drawer-detail.vue
View File

@@ -6,11 +6,16 @@
<dd>{{ role.id }}</dd>
</div>
</dl>
<v-divider />
<div class="page-description" v-html="marked($t('page_help_settings_roles_detail'))" />
</drawer-detail>
</template>
<script lang="ts">
import { defineComponent, PropType } from '@vue/composition-api';
import marked from 'marked';
export default defineComponent({
props: {
@@ -23,5 +28,14 @@ export default defineComponent({
default: null,
},
},
setup() {
return { marked };
},
});
</script>
<style lang="scss" scoped>
.v-divider {
margin: 20px 0;
}
</style>

5
app/src/modules/settings/routes/roles/detail/detail.vue
View File

@@ -91,9 +91,6 @@
<template #drawer>
<role-info-drawer-detail :is-new="isNew" :role="item" />
<revisions-drawer-detail v-if="isNew === false" collection="directus_roles" :primary-key="primaryKey" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_collections_overview'))" />
</drawer-detail>
</template>
</private-view>
</template>
@@ -106,7 +103,6 @@ import router from '@/router';
import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-detail';
import useItem from '@/composables/use-item';
import SaveOptions from '@/views/private/components/save-options';
import marked from 'marked';
import { useUserStore } from '@/stores/';
import RoleInfoDrawerDetail from './components/role-info-drawer-detail';
@@ -153,7 +149,6 @@ export default defineComponent({
saveAndAddNew,
saveAsCopyAndNavigate,
isBatch,
marked,
};
/**

5
app/src/modules/settings/routes/webhooks/browse/browse.vue
View File

@@ -61,13 +61,10 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_settings_webhooks_browse'))" />
<div class="page-description" v-html="marked($t('page_help_settings_webhooks_browse'))" />
</drawer-detail>
<layout-drawer-detail />
<portal-target name="drawer" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_webhooks_browse'))" />
</drawer-detail>
</template>
</private-view>
</template>

5
app/src/modules/settings/routes/webhooks/detail/detail.vue
View File

@@ -59,12 +59,9 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_settings_webhooks_detail'))" />
<div class="page-description" v-html="marked($t('page_help_settings_webhooks_detail'))" />
</drawer-detail>
<revisions-drawer-detail v-if="isNew === false" collection="directus_webhooks" :primary-key="primaryKey" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_settings_webhooks_detail'))" />
</drawer-detail>
</template>
</private-view>
</template>

5
app/src/modules/users/routes/browse/browse.vue
View File

@@ -93,13 +93,10 @@
<template #drawer>
<drawer-detail icon="info_outline" :title="$t('information')" close>
<div class="format-markdown" v-html="marked($t('page_help_users_browse'))" />
<div class="page-description" v-html="marked($t('page_help_users_browse'))" />
</drawer-detail>
<layout-drawer-detail @input="viewType = $event" :value="viewType" />
<portal-target name="drawer" />
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_users_browse'))" />
</drawer-detail>
</template>
</private-view>
</template>

16
app/src/modules/users/routes/detail/components/user-info-drawer-detail.vue
View File

@@ -29,14 +29,15 @@
</div>
</dl>
<template v-else>
--
</template>
<v-divider />
<div class="page-description" v-html="marked($t('page_help_users_detail'))" />
</drawer-detail>
</template>
<script lang="ts">
import { defineComponent } from '@vue/composition-api';
import marked from 'marked';
export default defineComponent({
props: {
@@ -49,5 +50,14 @@ export default defineComponent({
default: false,
},
},
setup(props) {
return { marked };
},
});
</script>
<style lang="scss" scoped>
.v-divider {
margin: 20px 0;
}
</style>

5
app/src/modules/users/routes/detail/detail.vue
View File

@@ -121,9 +121,6 @@
collection="directus_users"
:primary-key="primaryKey"
/>
<drawer-detail icon="help_outline" :title="$t('help_and_docs')">
<div class="format-markdown" v-html="marked($t('page_help_users_detail'))" />
</drawer-detail>
</template>
</private-view>
</template>
@@ -138,7 +135,6 @@ import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-d
import CommentsDrawerDetail from '@/views/private/components/comments-drawer-detail';
import useItem from '@/composables/use-item';
import SaveOptions from '@/views/private/components/save-options';
import marked from 'marked';
import api from '@/api';
import { useFieldsStore } from '@/stores/';
import useFormFields from '@/composables/use-form-fields';
@@ -258,7 +254,6 @@ export default defineComponent({
saveAsCopyAndNavigate,
isBatch,
revisionsDrawerDetail,
marked,
previewLoading,
avatarSrc,
roleName,

5
app/src/views/private/components/drawer-detail/drawer-detail.vue
View File

@@ -151,7 +151,10 @@ body {
.content {
padding: 16px;
::v-deep {
.format-markdown {
.page-description {
color: var(--foreground-subdued);
margin-bottom: 8px;
a {
color: var(--primary);
}