Apply all logos via uiLogo (polkadot) (#8956)

* Apply all logos via uiLogo (polkadot)

* Adjust

* Adjust README

Author: jacogr

README.md

@@ -8,29 +8,11 @@ If you run one or more IPFS node(s), pinning the UI (which only gets updated on
 
 **Important** If you are a chain developer and would like to add support for your chain to the UI, all the local configuration (API types, settings, logos) can be customized in [the apps-config package](packages/apps-config#README.md), complete with instructions of what goes where.
 
-## overview
-
-The repo is split into a number of packages, each representing an application. These are -
-
-- [apps](packages/apps/) This is the main entry point. It handles the selection sidebar and routing to the specific application being displayed.
-- [apps-electron](packages/apps-electron/) Desktop app running [apps](packages/apps/).
-- [page-accounts](packages/page-accounts/) A basic account management app.
-- [page-address-book](packages/page-address-book/) A basic address management app.
-- [page-democracy](packages/page-democracy/) A basic voting app, allowing votes on activate proposals and referenda.
-- [page-explorer](packages/page-explorer/) A simple block explorer. It only shows the most recent blocks, updating as they become available.
-- [page-extrinsics](packages/page-extrinsics/) Submission of extrinsics to a node.
-- [page-js](packages/page-js/) An online code editor with [@polkadot-js/api](https://github.com/polkadot-js/api/tree/master/packages/api) access to the currently connected node.
-- [page-settings](packages/page-settings/) A basic settings management app, allowing choice of language, node to connect to, and theme
-- [page-staking](packages/page-staking/) A basic staking management app, allowing staking and nominations.
-- [page-storage](packages/page-storage/) A simple node storage query application. Multiple queries can be queued and updates as new values become available.
-- [page-toolbox](packages/page-toolbox/) Submission of raw data to RPC endpoints and utility hashing functions.
-- [page-transfer](packages/page-transfer/) A basic account management app, allowing transfer of Units/DOTs between accounts.
-
-In addition the following libraries are also included in the repo. These are to be moved to the [@polkadot/ui](https://github.com/polkadot-js/ui/) repository once it reaches a base level of stability and usability. (At this point with the framework being tested on the apps above, it makes development easier having it close)
-
-- [react-components](packages/react-components/) A reactive (using RxJS) application framework with a number of useful shared components.
-- [react-signer](packages/react-signer/) Signer implementation for apps.
-- [react-query](packages/react-query) Base components that use the RxJS Observable APIs
+
+## Overview
+
+The repo is split into a number of packages, each representing an application.
+
 
 ## Development
 
@@ -47,6 +29,7 @@ To get started -
 5. Ready! Now you can launch the UI (assuming you have a local Polkadot Node running), via `yarn run start`
 6. Access the UI via [http://localhost:3000](http://localhost:3000)
 
+
 ## Docker
 
 You can run a docker container via -

packages/apps-config/README.md

@@ -3,9 +3,7 @@
 General config for various services, including settings, external links & types. This is a central source of all the configuration settings that can be tweaked. This also means that it can be customized (via PR) to support any additional chains. The internals are split into a number of settings -
 
 - [api](./src/api) - Here you can add any chain or node-type specific types configuration. When added, it means that when the UI connects to either a runtime with a spec name, or a chain with a specific name, the types will be automatically added to the API as used in the app.
-- [links](./src/links) - These are all links to external providers such as explorers. This information is used anywhere where there is an external link to determine the providers for these links.
-- [settings](./src/settings) - These are used in dropdowns, specifically under the settings page.
-- [ui](./src/ui) - Logos & color settings for chain and node spec specific overrides. This means that when the runtime/chain is detected, the specific logo would be used.
+- [endpoints](./src/endpoints) - Configuration for specific per-type chain endpoints.
 
 Customization for each of these are discussed next.
 
@@ -18,26 +16,10 @@ The API config can be done in one of two ways -
 
 The actual type definitions you should be familiar with, it is exactly the same as you would upload via the settings page in JSON, or as detailed in the [API types pages](https://polkadot.js.org/api/start/types.extend.html#extending-types).
 
-## Links
 
-We are not going to spend too much time here, since it is generally applicable to explorers and like services. However, should you run one of these services, you can take a look at the existing configs and customize for your setup.
+## Endpoints
 
-## Settings
-
-There are 2 general areas of interest here -
-
-- [endpoints](./src/settings) - This is where we can add additional endpoints to appear in the dropdowns. We would like to keep this to mostly live networks, although based on demand can probably extend to a testing-only section as well.
-- [ss58](./src/settings) - Should you wish to add your ss58Format to the settings dropdown, this is where the configuration take place
-
-## UI
-
-These are self-explanatory and config here actually does get used in other parts as well. Basically the information here is broken down into a couple of categories -
-
-- [colors](./src/ui/colors.ts)
-  - color configuration based on chain
-- [identityIcon](./src/ui/identityIcons)
-  - specific identityIcon to use based on node name
-- [logos](./src/ui/logos)
-  - chains - Specific logos when connecting to a specific chain
-  - nodes - Logos that are used when connecting to a specific runtime spec type (catch-all)
-  - named - These logos are used as overrides when we pass an explicit logo name 
+1. Add your chain logo (if available) to either `ui/logos/chains` or `ui/logos/nodes` (the second is generally used)
+2. Run the image build command to generate an inline version via `yarn build:images`
+3. Add your chain to `endpoints/{production, productionRelay, testing, testingRelay*}` as applicable for your deployment
+3. The `uiColor` specifies the chain color, the `uiLogo` (importted from generated), specifies the specific logo