bryanwilhite / songhay-ng-workspace Goto Github PK

View Code? Open in Web Editor NEW

1.0 1.0 0.0 9.96 MB

Angular workspace of shared libraries and ‘studio floor’ client

License: MIT License

JavaScript 2.77% TypeScript 83.18% HTML 5.73% SCSS 8.32%

angular angular-material karma-jasmine npm-module npm-package scss typescript

songhay-ng-workspace's People

Contributors

Stargazers

Watchers

songhay-ng-workspace's Issues

SEC7115: :visited and :link styles can only differ by color. Some styles were not applied to :visited.

this looks like an accessibility issue

filtering particles should highlight text

the text typed into the filter should highlight the same text in the index

are you properly unsubscribing your observables?

this Medium post introduces me to the issue of unsubscribing RxJs observables (and the importance of ngOnDestroy); have later versions of Angular/RxJs mitigated this issue or do we still have to all this complex ceremony?

add indicator arrow for yt set menu

approximate behavior:

use https://materialdesignicons.com/icon/arrow-down-drop-circle:

make @songhay/player-video-you-tube styling configurable

continues from #20

@songhay/core needs to be published

📦 do a patch bump

blocker for BryanWilhite/Songhay.Dashboard#53

consider using HttpClient interceptors to cache requests and handle Domain conversion of responses

see How to use HttpClient and HttpInterceptor to Cache Requests in Angular 5

upgrade dependencies 📦↑

be aware of previous notes on Angular upgrades:
follow https://update.angular.io/?v=9.1-10.2 [📖 docs]
follow https://update.angular.io/?v=10.2-11.0
follow https://update.angular.io/?v=11.0-12.0

does @songhay/player-audio-progressive lib still need audio5js or equivalent?

there was activity for audio5js development last year and coverage for the Audio element is upwards of 95%

switch to modern HttpClient and HttpClientTestingModule

from:

in 2017, @cironunes introduced HttpClient, highlighting interceptors and listening for progress: https://blog.angularindepth.com/the-new-angular-httpclient-api-9e5c85fe3361

warning: "No name was provided for external module..."

> ng build @songhay/player-video-you-tube

Building Angular Package
Building entry point '@songhay/player-video-you-tube'
Compiling TypeScript sources through ngc
Bundling to FESM2015
Bundling to FESM5
Bundling to UMD
No name was provided for external module 'songhay-core/utilities/css.utility' in output.globals – guessing 'css_utility'
No name was provided for external module 'lodash' in output.globals – guessing 'lodash_'
No name was provided for external module 'moment' in output.globals – guessing 'moment_'
No name was provided for external module 'songhay-core/utilities/dom.utility' in output.globals – guessing 'dom_utility'
No name was provided for external module '@songhay/core' in output.globals – guessing 'core'
Minifying UMD bundle
Side effects in initialization of unused variable lb [0:826,20]

topic-driven SVG icons needed to break up monotomy

Each topic in topics.opml [GitHub] should have an associated SVG icon so they can add more visual cues to the Index:

This is really an Index app enhancement so I might be confusing myself by lodging this issue here.

generate @songhay/player-audio-progressive lib and migrate assets

migrate assets from private repo:

some topic keywords are ignored

keyword aurelia is not picking up aurelia-inspired
keyword @azure is not working
keyword bootstraps is not picking up bootstrap’s
compound keyword front_end is not picking up front-end

`ng build --prod`: `compilation of entry points` error

Warning: Entry point '@songhay/player-video-you-tube' contains deep imports into '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/utilities/object.utility', '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/utilities/css.utility', '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/utilities/dom.utility', '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/models/fragment', '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/models/presentation'. This is probably not a problem, but may cause the compilation of entry points to be out of order.
Warning: Entry point '@songhay/index' contains deep imports into '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/utilities/display-item.utility', '/home/rasx/sourceRoot/songhay-ng-workspace/songhay/node_modules/songhay/core/models/menu-display-item.model'. This is probably not a problem, but may cause the compilation of entry points to be out of order.

eventually the index will outgrow a single JSON file, no?

what is the plan when the index grows to, say, 1GB or more?

what learnings are there out there to help you as you tread in deeper architectural waters?

re-factor yt player lib to use AppDataStore

move beyond #6 by re-factoring the tests to use HttpClientTestingModule as well

add sample based on angular - How can I call a service within a pipe?”

https://stackoverflow.com/questions/39480929/how-can-i-call-a-service-within-a-pipe

try TsUML for @songhay/core at least 📚

https://github.com/remojansen/TsUML

Error: Cannot call a namespace ('moment')

ng build @songhay/player-video-you-tube
Building Angular Package
Building entry point '@songhay/player-video-you-tube'
Compiling TypeScript sources through ngc
Bundling to FESM2015

BUILD ERROR
Cannot call a namespace ('moment')
Error: Cannot call a namespace ('moment')
    at error (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:3460:30)
    at Module.error (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:13349:9)
    at CallExpression.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:10228:30)
    at MemberExpression$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at MemberExpression$$1.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:11261:35)
    at CallExpression.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at CallExpression.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:10224:31)
    at VariableDeclarator.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at VariableDeclaration$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9179:31)
    at BlockStatement$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9179:31)

Cannot call a namespace ('moment')
Error: Cannot call a namespace ('moment')
    at error (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:3460:30)
    at Module.error (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:13349:9)
    at CallExpression.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:10228:30)
    at MemberExpression$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at MemberExpression$$1.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:11261:35)
    at CallExpression.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at CallExpression.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:10224:31)
    at VariableDeclarator.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9183:23)
    at VariableDeclaration$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9179:31)
    at BlockStatement$$1.NodeBase.bind (..\songhay-ng-workspace\songhay\node_modules\rollup\dist\rollup.js:9179:31)

clicking on yt dash link throws error

the Dashboard project hosting @songhay/player-video-you-tube lib is throwing an error when deep-linking into lib:

ERROR Error: Uncaught (in promise): TypeError: Array.prototype.map: argument is not a Function object TypeError: Array.prototype.map: argument is not a Function object at webpackAsyncContext (http://localhost:4200/main.js:345:2) at SystemJsNgModuleLoader.prototype.loadAndCompile (http://localhost:4200/vendor.js:83114:9) at SystemJsNgModuleLoader.prototype.load (http://localhost:4200/vendor.js:83106:9) at RouterConfigLoader.prototype.loadModuleFactory (http://localhost:4200/vendor.js:153224:13) at RouterConfigLoader.prototype.load (http://localhost:4200/vendor.js:153212:9) at Anonymous function (http://localhost:4200/vendor.js:152215:21) at MergeMapSubscriber.prototype._tryNext (http://localhost:4200/vendor.js:199943:13) at MergeMapSubscriber.prototype._next (http://localhost:4200/vendor.js:199933:13) at Subscriber.prototype.next (http://localhost:4200/vendor.js:194390:13) at Anonymous function (http://localhost:4200/vendor.js:196569:9)

add deep-linking support to index groups grouping

the index grouping view defaults to the first element in IndexOptions.indexGroupingOptions; this should also be controlled by routing

make @songhay/index styling configurable

a conventional and/or configurable external CSS file should provide styling customization for the Index App

continuing on from #11

`ng update` does not really touch karma-jasmine and typescript packages

i notice that blindly updating karma-jasmine related packages can break things; what is the recommended guidance?

> npm outdated

Package                       Current    Wanted   Latest  Location
@types/jasmine                 2.8.16    2.8.16   3.5.10  songhay-ng-workspace
@types/node                  12.12.34  12.12.34  13.11.0  songhay-ng-workspace
@types/numeral                 0.0.25    0.0.25   0.0.26  songhay-ng-workspace
core-js                        2.6.11    2.6.11    3.6.4  songhay-ng-workspace
jasmine-core                   2.99.1    2.99.1    3.5.0  songhay-ng-workspace
jasmine-spec-reporter           4.2.1     4.2.1    5.0.1  songhay-ng-workspace
karma-chrome-launcher           2.2.0     2.2.0    3.1.0  songhay-ng-workspace
karma-jasmine                   1.1.2     1.1.2    3.1.1  songhay-ng-workspace
karma-jasmine-html-reporter     0.2.2     0.2.2    1.5.3  songhay-ng-workspace
ts-node                         7.0.1     7.0.1    8.8.2  songhay-ng-workspace
tslint                         5.11.0    5.11.0    6.1.1  songhay-ng-workspace

Error: Cannot call a namespace ('_')

see #2

ng build BUILD ERROR Can't export value as it was neither declared nor imported

this error is described here: https://stackoverflow.com/questions/44133513/cant-export-service-from-module-it-was-neither-declared-nor-imported

full error:

ng build @songhay/core
Building Angular Package
Building entry point '@songhay/core'
Compiling TypeScript sources through ngc

BUILD ERROR
: Can't export value AppDataService in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-app-data.service.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!
: Can't export value DomSanitizerUtility in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-dom-sanitizer.utility.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!

Error: : Can't export value AppDataService in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-app-data.service.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!
: Can't export value DomSanitizerUtility in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-dom-sanitizer.utility.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!

    at Object.<anonymous> (..\songhay-ng-workspace\songhay\node_modules\ng-packagr\lib\ngc\compile-source-files.js:51:19)
    at Generator.next (<anonymous>)
    at fulfilled (..\songhay-ng-workspace\songhay\node_modules\ng-packagr\lib\ngc\compile-source-files.js:4:58)

: Can't export value AppDataService in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-app-data.service.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!
: Can't export value DomSanitizerUtility in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-dom-sanitizer.utility.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!

Error: : Can't export value AppDataService in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-app-data.service.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!
: Can't export value DomSanitizerUtility in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/services/songhay-dom-sanitizer.utility.ts from SonghayAngularCoreModule in ../songhay-ng-workspace/songhay/projects/songhay/core/src/lib/songhay-angular-core.module.ts as it was neither declared nor imported!

    at Object.<anonymous> (..\songhay-ng-workspace\songhay\node_modules\ng-packagr\lib\ngc\compile-source-files.js:51:19)
    at Generator.next (<anonymous>)
    at fulfilled (..\songhay-ng-workspace\songhay\node_modules\ng-packagr\lib\ngc\compile-source-files.js:4:58)

as an alternative to AppDataService add AppDataStore (Observable Data Service)

AppDataService [GitHub] is deeply concerned with promises; instead of deleting this legacy add a new class AppDataStore (which is an observable data service)

https://coryrylan.com/blog/angular-observable-data-services
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
https://blog.angular-university.io/how-to-build-angular2-apps-using-rxjs-observable-data-services-pitfalls-to-avoid/

relative path issues: will passing around location.path() help?

i will need to go back and read up (again) on Angular routing but it seems to me that relative paths are not working the way i expect and to control them explicitly location.path() might help

when we want to make a relative path that replaces the existing path, prefix with / but replacing a portion of an existing path does not seem to be possible without playing around with location.path()

https://angular.io/guide/router#relative-navigation
https://angular.io/guide/router#module-import-order-matters

upgrade to Angular 9

the abandoned security vulnerabilities in 7.x is reason enough to move forward

staying in version 7.x means addressing this issue (only on Ubuntu):

> ng build

Schema validation failed with the following errors: 

  Data path ".builders['app-shell']" should have required property 'class'. 

Error: Schema validation failed with the following errors: 

  Data path ".builders['app-shell']" should have required property 'class'.

The downgrade of @angular-devkit/build-angular to 0.13.0 fixes this issue but this downgrade introduces vulnerabilities.

consider cancelling the @songhay/player-audio-progressive project

The project, https://github.com/BryanWilhite/songhay-ng-workspace/projects/1, could be replaced by an equivalent Web component project

remove `you-tube-presentation` component

remove this: https://github.com/BryanWilhite/songhay-ng-workspace/tree/master/songhay/projects/songhay/player-video-you-tube/src/lib/components/you-tube-presentation

this UX should be replaced by a Songhay Web Component

blocker BryanWilhite/songhay-web-components#17

publish packages on npm (https://www.npmjs.com/)

https://hackernoon.com/how-to-publish-your-package-on-npm-7fc1f5aae600

add caching (with `Window.localStorage`?) to `player-video-you-tube`

Window.localStorage should be sufficient for client-side caching

Data stored in either localStorage is specific to the protocol of the page. In particular, data stored by a script on a site accessed with HTTP (e.g., http://example.com) is put in a different localStorage object from the same site accessed with HTTPS (e.g., https://example.com).

📖 https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

investigate Angular caching
make client-side caching optional (to support any server-side caching)

migrate filter-form CSS from `Songhay.Blog`

extends from #20

migrate:

app-index-groups.component.scss [GitHub]
app-index-list.component.scss [GitHub]

bryanwilhite / songhay-ng-workspace Goto Github PK

songhay-ng-workspace's People

Contributors

Stargazers

Watchers

songhay-ng-workspace's Issues

Recommend Projects

Recommend Topics

Recommend Org