Code Monkey home page Code Monkey logo

helix-assets-ui's Introduction

Helix Assets / Assets Across Adobe

Search UI for Assets Across Adobe prototype

Project Links

Customer Environments

These require a password (read only algolia api token).

How to add a new customer

  1. Create branch from main named <customer>_hlx_media
  2. This automatically creates https://<customer>_hlx_media--helix-assets-ui--adobe.hlx.live> https://<customer>.hlx.media
  3. On the <customer>_hlx_media branch adjust the scripts/scripts.js for naming and branding
    • window.tenantTitle
    • window.tenantLogo
  4. Login to Algolia, app SWFXY1CU7X
  5. Create a new index <customer>_assets, copy settings from <adobe>_assets
  6. Under Configure > Query Suggestions create a new suggestion index <customer>_assets_query_suggestions using <customer>_assets as source index
  7. Go to Settings > API Keys to manage Algolia api keys
  8. Add new search only key / password for search site
    • Description: Search only key for "<customer>"
    • Indices: <customer_assets and <customer>_assets_query_suggestions
    • ACL: search
  9. Create a new write key or reuse existing
    • Description: Ingestion key for "<customer>"
    • Indices: <customer_assets and <customer>_assets_query_suggestions
    • ACL: search, addObject, deleteObject, browse
  10. Scan/crawl/index content using the write key
    export SCAN_CUSTOMER=<customer>
    export SCAN_INDEX_API_KEY=<write-key>
    
    scan <cmd> ...
    

Development Environments

To select a custom tenant set the tenant query parameter:

https://main--helix-assets-ui--adobe.hlx.page/?tenant=<customer>

To logout, go to Browser Developer Console > Storage or Application > Local Storage and find & delete the algoliaApiKey key. Then reload the page.

Local development

  1. Install the Helix CLI: npm install -g @adobe/helix-cli
  2. Run npm install
  3. Start Helix Pages Proxy: hlx up (opens your browser at http://localhost:3000)
  4. Open the {repo} directory in your favorite IDE and start coding :)

helix-assets-ui's People

Contributors

alexkli avatar davidnuescheler avatar pkoch73 avatar theadriann avatar trieloff avatar

Stargazers

 avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

helix-assets-ui's Issues

search box freezes on autocompletion (Safari?)

When entering characters into the search bar, the search box (and entire page) often freezes for 10-30 seconds or so.

I noticed this starting April 19 (but I was not using the system for more than a week before that, so could have been introduced earlier).

Actual search results and image display will happen very quickly once the freeze is over. It seems it is related to the auto completion or similar that happens on every key entry (but not sure). Might also be browser specific.

Browser: Safari 15.4 on macOS

[detail view] similar asset list shows the current asset twice

Problem

On the detail view for an asset, the similar asset list at the bottom shows the current asset twice at the beginning. If you click on those, it links to the current asset/url.

Expected

It should not repeat the current asset at all, only list other similar assets.

similar images fail to load

On the detail page, no similar images are shown, as the request for similar images always fails with a 500:

curl -v https://helix-pages.anywhere.run/helix-services/asset-ingestor@v1?url=https%3A%2F%2Fblog.adobe.com%2Fen%2Fpublish%2F2019%2F05%2F30%2Fmedia_178b1fc8d50ec96c5d7d4cd918f5e0264b3dc2b83.png

Error message in the header (no body present):

x-error: Cannot find user helix-assets-poc-adobe-test. Please upload your data.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.