random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-12-20 09:20:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updates to standalone gallery (#91)

Browse Source 
* Add hyperlink icon for links in DialogComponent

* Use a Cosmos DB image for sample Persona

* Fix tests

* Update standalone gallery behavior to match DE gallery

* Use /gallery endpoint for gallery

* Update Gallery Card style to remove buttons in standalone mode

* Address comments

* Add text banner
This commit is contained in:
Tanuj Mittal
2020-07-15 13:58:43 -07:00
committed by GitHub
parent 543ae9fe4a
commit b1e20796c2
21 changed files with 484 additions and 536 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/GalleryViewer/GalleryViewer.tsx
View File

@@ -1,31 +1,33 @@
import "bootstrap/dist/css/bootstrap.css";
import { initializeIcons } from "office-ui-fabric-react/lib/Icons";
import { Text, Link } from "office-ui-fabric-react";
import * as React from "react";
import * as ReactDOM from "react-dom";
import { initializeConfiguration } from "../Config";
import { GalleryHeaderComponent } from "../Explorer/Controls/Header/GalleryHeaderComponent";
import {
GalleryTab,
GalleryViewerComponent,
GalleryViewerComponentProps,
SortBy
} from "../Explorer/Controls/NotebookGallery/GalleryViewerComponent";
GalleryAndNotebookViewerComponent,
GalleryAndNotebookViewerComponentProps
} from "../Explorer/Controls/NotebookGallery/GalleryAndNotebookViewerComponent";
import { GalleryTab, SortBy } from "../Explorer/Controls/NotebookGallery/GalleryViewerComponent";
import { JunoClient } from "../Juno/JunoClient";
import * as GalleryUtils from "../Utils/GalleryUtils";
import { GalleryHeaderComponent } from "../Explorer/Controls/Header/GalleryHeaderComponent";
const enableNotebooksUrl = "https://aka.ms/cosmos-enable-notebooks";
const createAccountUrl = "https://aka.ms/cosmos-create-account-portal";
const onInit = async () => {
const dataExplorerUrl = new URL("./", window.location.href).href;
initializeIcons();
await initializeConfiguration();
const galleryViewerProps = GalleryUtils.getGalleryViewerProps(window.location.search);
const props: GalleryViewerComponentProps = {
const props: GalleryAndNotebookViewerComponentProps = {
junoClient: new JunoClient(),
selectedTab: galleryViewerProps.selectedTab || GalleryTab.OfficialSamples,
sortBy: galleryViewerProps.sortBy || SortBy.MostViewed,
searchText: galleryViewerProps.searchText,
onSelectedTabChange: undefined,
onSortByChange: undefined,
onSearchTextChange: undefined
searchText: galleryViewerProps.searchText
};
const element = (
@@ -34,7 +36,21 @@ const onInit = async () => {
<GalleryHeaderComponent />
</header>
<div style={{ marginLeft: 138, marginRight: 138 }}>
<GalleryViewerComponent {...props} />
<div style={{ paddingLeft: 26, paddingRight: 26, paddingTop: 20 }}>
<Text block>
Welcome to the Azure Cosmos DB notebooks gallery! View the sample notebooks to learn about use cases, best
practices, and how to get started with Azure Cosmos DB.
</Text>
<Text styles={{ root: { marginTop: 10 } }} block>
If you'd like to run or edit the notebook in your own Azure Cosmos DB account,{" "}
<Link href={dataExplorerUrl}>sign in</Link> and select an account with{" "}
<Link href={enableNotebooksUrl}>notebooks enabled</Link>. From there, you can download the sample to your
account. If you don't have an account yet, you can{" "}
<Link href={createAccountUrl}>create one from the Azure portal</Link>.
</Text>
</div>
<GalleryAndNotebookViewerComponent {...props} />
</div>
</>
);

2
src/GalleryViewer/galleryViewer.html
View File

@@ -7,7 +7,7 @@
<link rel="shortcut icon" href="images/CosmosDB_rgb_ui_lighttheme.ico" type="image/x-icon" />
</head>
<body>
<body style="overflow-y:scroll">
<div class="galleryContent" id="galleryContent"></div>
</body>
</html>