Make main frontend selectable between ember-osf-web and angular-osf

Author: chiku

docker-compose.yml

@@ -284,6 +284,23 @@ services:
       - ember_osf_web_dist_vol:/code/dist
     stdin_open: true
 
+  #################
+  # Anguler OSF   #
+  #################
+
+  angular_osf:
+    image: chiku314/angular-osf:latest
+    ports:
+      - '4300:4300'
+    depends_on:
+      - api
+      - web
+    environment:
+      - CHOKIDAR_USEPOLLING=true
+      - WATCHPACK_POLLING=true
+      - NG_CLI_ANALYTICS=false
+    command: ['npx', 'ng', 'serve', '--host', '0.0.0.0', '--port', '4300', '--poll', '2000']
+
   #############
   # Preprints #
   #############

website/ember_osf_web/views.py

@@ -5,15 +5,33 @@
 
 from website.settings import EXTERNAL_EMBER_APPS
 
-ember_osf_web_dir = os.path.abspath(os.path.join(os.getcwd(), EXTERNAL_EMBER_APPS['ember_osf_web']['path']))
+def get_primary_app_config():
+    from website.settings import PRIMARY_WEB_APP
+    return EXTERNAL_EMBER_APPS.get(PRIMARY_WEB_APP, {})
+
+def get_primary_app_dir():
+    app_config = get_primary_app_config()
+    if 'path' in app_config:
+        return os.path.abspath(os.path.join(os.getcwd(), app_config['path']))
+    return None
 
 routes = [
     '/institutions/',
 ]
 
 def use_ember_app(**kwargs):
+    from rest_framework import status as http_status
+    from framework.exceptions import HTTPError
     from website.views import stream_emberapp
-    resp = stream_emberapp(EXTERNAL_EMBER_APPS['ember_osf_web']['server'], ember_osf_web_dir)
+
+    app_config = get_primary_app_config()
+    if not app_config:
+        raise HTTPError(
+            http_status.HTTP_500_INTERNAL_SERVER_ERROR,
+            data={'message': 'Primary web app not configured'}
+        )
+
+    resp = stream_emberapp(app_config['server'], get_primary_app_dir())
     messages = pop_status_messages()
     if messages:
         try:

website/routes.py

@@ -265,7 +265,11 @@ def ember_app(path=None):
         raise HTTPError(http_status.HTTP_404_NOT_FOUND)
 
     if settings.PROXY_EMBER_APPS:
-        path = request.path[len(ember_app['path']):]
+        strip_prefix = ember_app.get('strip_prefix')
+        if strip_prefix or strip_prefix is None:
+            path = request.path[len(ember_app['path']):]
+        else:
+            path = request.path
         url = urljoin(ember_app['server'], path)
         resp = requests.get(url, stream=True, timeout=EXTERNAL_EMBER_SERVER_TIMEOUT, headers={'accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8'})
         excluded_headers = ['content-encoding', 'content-length', 'transfer-encoding', 'connection']
@@ -378,7 +382,11 @@ def make_url_map(app):
                 ),
             ], prefix='/' + prefix)
 
-        if EXTERNAL_EMBER_APPS.get('ember_osf_web'):
+        # Import PRIMARY_WEB_APP setting
+        from website.settings import PRIMARY_WEB_APP
+        
+        primary_app_config = EXTERNAL_EMBER_APPS.get(PRIMARY_WEB_APP)
+        if primary_app_config:
             process_rules(app, [
                 Rule(
                     ember_osf_web_views.routes,
@@ -387,8 +395,8 @@ def make_url_map(app):
                     notemplate
                 )
             ])
-            if 'routes' in EXTERNAL_EMBER_APPS['ember_osf_web']:
-                for route in EXTERNAL_EMBER_APPS['ember_osf_web']['routes']:
+            if 'routes' in primary_app_config:
+                for route in primary_app_config['routes']:
                     process_rules(app, [
                         Rule(
                             [

website/settings/local-ci.py

@@ -27,6 +27,7 @@
     'suffix': ':4201/'
 }
 USE_EXTERNAL_EMBER = True
+PRIMARY_WEB_APP = 'ember_osf_web'
 EXTERNAL_EMBER_APPS = {
     'ember_osf_web': {
         'server': 'http://localhost:4200',

website/settings/local-dist.py

@@ -33,6 +33,8 @@
 PROXY_EMBER_APPS = True
 EMBER_DOMAIN = environ.get('EMBER_DOMAIN', 'localhost')
 LIVE_RELOAD_DOMAIN = f'http://{EMBER_DOMAIN}:4200'  # Change port for the current app
+# Primary web frontend app configuration - change this to switch between ember and angular
+PRIMARY_WEB_APP = 'angular_osf'
 EXTERNAL_EMBER_APPS = {
     'ember_osf_web': {
         'server': f'http://{EMBER_DOMAIN}:4200/',
@@ -43,6 +45,16 @@
             'handbook',
         ],
     },
+    'angular_osf': {
+        'server': f'http://{EMBER_DOMAIN}:4300/',
+        'path': '/angular_osf/',
+        'strip_prefix': False,
+        'routes': [
+            'collections',
+            'registries',
+            'handbook',
+        ],
+    },
     'preprints': {
         'server': f'http://{EMBER_DOMAIN}:4201/',
         'path': '/preprints/'

website/views.py

@@ -35,7 +35,14 @@
 from api.waffle.utils import storage_i18n_flag_active, flag_is_active
 
 logger = logging.getLogger(__name__)
-ember_osf_web_dir = os.path.abspath(os.path.join(os.getcwd(), EXTERNAL_EMBER_APPS['ember_osf_web']['path']))
+def get_primary_web_app_dir():
+    from website.settings import PRIMARY_WEB_APP
+    primary_app_config = EXTERNAL_EMBER_APPS.get(PRIMARY_WEB_APP, {})
+    if 'path' in primary_app_config:
+        return os.path.abspath(os.path.join(os.getcwd(), primary_app_config['path']))
+    return None
+
+primary_web_app_dir = get_primary_web_app_dir()
 
 
 def serialize_contributors_for_summary(node, max_count=3):