@plusscommunities/pluss-feature-builder-app-d 1.0.1-beta.3 → 1.0.1-beta.5

package/dist/module/webapi/featureBuilderAPI.js

@@ -1,15 +1,9 @@
 import { getUrl } from "./helper";
 import { authedFunction } from "../js";
 import { values } from "../values.config";
-
-// Helper function for constructing URLs
-const getFeatureBuilderUrl = (action, query = null) => {
-  return getUrl(values.apiNamespace, action, query);
-};
 export const featureBuilderAPI = {
-  // Fetch all feature definitions
   getFeatureDefinitions: site => {
-    const url = getFeatureBuilderUrl(values.api.getDefinitions, {
+    const url = getUrl(values.serviceKey, values.api.getDefinitions, {
       site
     });
     const request = {
@@ -22,7 +16,6 @@ export const featureBuilderAPI = {
       throw error;
     });
   },
-  // Fetch listings for all features or specific feature
   getFeatureListings: (site, featureDefinitionId = null) => {
     const queryParams = {
       site
@@ -30,7 +23,7 @@ export const featureBuilderAPI = {
     if (featureDefinitionId) {
       queryParams.featureDefinitionId = featureDefinitionId;
     }
-    const url = getFeatureBuilderUrl(values.api.getListings, queryParams);
+    const url = getUrl(values.serviceKey, values.api.getListings, queryParams);
     const request = {
       method: "GET",
       url
@@ -41,12 +34,11 @@ export const featureBuilderAPI = {
       throw error;
     });
   },
-  // Fetch a single listing by ID
   getSingleListing: (site, listingId) => {
     if (!listingId) {
       return Promise.reject(new Error("Listing ID is required"));
     }
-    const url = getFeatureBuilderUrl(values.api.getSingleListing, {
+    const url = getUrl(values.serviceKey, values.api.getSingleListing, {
       site,
       id: listingId
     });

package/dist/module/webapi/featureBuilderAPI.js.map

@@ -1 +1 @@
-{"version":3,"names":["getUrl","authedFunction","values","getFeatureBuilderUrl","action","query","apiNamespace","featureBuilderAPI","getFeatureDefinitions","site","url","api","getDefinitions","request","method","then","response","catch","error","getFeatureListings","featureDefinitionId","queryParams","getListings","getSingleListing","listingId","Promise","reject","Error","id"],"sources":["featureBuilderAPI.js"],"sourcesContent":["import { getUrl } from \"./helper\";\nimport { authedFunction } from \"../js\";\nimport { values } from \"../values.config\";\n\n// Helper function for constructing URLs\nconst getFeatureBuilderUrl = (action, query = null) => {\n\treturn getUrl(values.apiNamespace, action, query);\n};\n\nexport const featureBuilderAPI = {\n\t// Fetch all feature definitions\n\tgetFeatureDefinitions: (site) => {\n\t\tconst url = getFeatureBuilderUrl(values.api.getDefinitions, { site });\n\n\t\tconst request = {\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t};\n\n\t\treturn authedFunction(request)\n\t\t\t.then((response) => {\n\t\t\t\treturn response;\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tthrow error;\n\t\t\t});\n\t},\n\n\t// Fetch listings for all features or specific feature\n\tgetFeatureListings: (site, featureDefinitionId = null) => {\n\t\tconst queryParams = { site };\n\t\tif (featureDefinitionId) {\n\t\t\tqueryParams.featureDefinitionId = featureDefinitionId;\n\t\t}\n\t\tconst url = getFeatureBuilderUrl(values.api.getListings, queryParams);\n\n\t\tconst request = {\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t};\n\n\t\treturn authedFunction(request)\n\t\t\t.then((response) => {\n\t\t\t\treturn response;\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tthrow error;\n\t\t\t});\n\t},\n\n\t// Fetch a single listing by ID\n\tgetSingleListing: (site, listingId) => {\n\t\tif (!listingId) {\n\t\t\treturn Promise.reject(new Error(\"Listing ID is required\"));\n\t\t}\n\t\tconst url = getFeatureBuilderUrl(values.api.getSingleListing, {\n\t\t\tsite,\n\t\t\tid: listingId,\n\t\t});\n\t\treturn authedFunction({\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t});\n\t},\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,UAAU;AACjC,SAASC,cAAc,QAAQ,OAAO;AACtC,SAASC,MAAM,QAAQ,kBAAkB;;AAEzC;AACA,MAAMC,oBAAoB,GAAGA,CAACC,MAAM,EAAEC,KAAK,GAAG,IAAI,KAAK;EACtD,OAAOL,MAAM,CAACE,MAAM,CAACI,YAAY,EAAEF,MAAM,EAAEC,KAAK,CAAC;AAClD,CAAC;AAED,OAAO,MAAME,iBAAiB,GAAG;EAChC;EACAC,qBAAqB,EAAGC,IAAI,IAAK;IAChC,MAAMC,GAAG,GAAGP,oBAAoB,CAACD,MAAM,CAACS,GAAG,CAACC,cAAc,EAAE;MAAEH;IAAK,CAAC,CAAC;IAErE,MAAMI,OAAO,GAAG;MACfC,MAAM,EAAE,KAAK;MACbJ;IACD,CAAC;IAED,OAAOT,cAAc,CAACY,OAAO,CAAC,CAC5BE,IAAI,CAAEC,QAAQ,IAAK;MACnB,OAAOA,QAAQ;IAChB,CAAC,CAAC,CACDC,KAAK,CAAEC,KAAK,IAAK;MACjB,MAAMA,KAAK;IACZ,CAAC,CAAC;EACJ,CAAC;EAED;EACAC,kBAAkB,EAAEA,CAACV,IAAI,EAAEW,mBAAmB,GAAG,IAAI,KAAK;IACzD,MAAMC,WAAW,GAAG;MAAEZ;IAAK,CAAC;IAC5B,IAAIW,mBAAmB,EAAE;MACxBC,WAAW,CAACD,mBAAmB,GAAGA,mBAAmB;IACtD;IACA,MAAMV,GAAG,GAAGP,oBAAoB,CAACD,MAAM,CAACS,GAAG,CAACW,WAAW,EAAED,WAAW,CAAC;IAErE,MAAMR,OAAO,GAAG;MACfC,MAAM,EAAE,KAAK;MACbJ;IACD,CAAC;IAED,OAAOT,cAAc,CAACY,OAAO,CAAC,CAC5BE,IAAI,CAAEC,QAAQ,IAAK;MACnB,OAAOA,QAAQ;IAChB,CAAC,CAAC,CACDC,KAAK,CAAEC,KAAK,IAAK;MACjB,MAAMA,KAAK;IACZ,CAAC,CAAC;EACJ,CAAC;EAED;EACAK,gBAAgB,EAAEA,CAACd,IAAI,EAAEe,SAAS,KAAK;IACtC,IAAI,CAACA,SAAS,EAAE;MACf,OAAOC,OAAO,CAACC,MAAM,CAAC,IAAIC,KAAK,CAAC,wBAAwB,CAAC,CAAC;IAC3D;IACA,MAAMjB,GAAG,GAAGP,oBAAoB,CAACD,MAAM,CAACS,GAAG,CAACY,gBAAgB,EAAE;MAC7Dd,IAAI;MACJmB,EAAE,EAAEJ;IACL,CAAC,CAAC;IACF,OAAOvB,cAAc,CAAC;MACrBa,MAAM,EAAE,KAAK;MACbJ;IACD,CAAC,CAAC;EACH;AACD,CAAC","ignoreList":[]}
+{"version":3,"names":["getUrl","authedFunction","values","featureBuilderAPI","getFeatureDefinitions","site","url","serviceKey","api","getDefinitions","request","method","then","response","catch","error","getFeatureListings","featureDefinitionId","queryParams","getListings","getSingleListing","listingId","Promise","reject","Error","id"],"sources":["featureBuilderAPI.js"],"sourcesContent":["import { getUrl } from \"./helper\";\nimport { authedFunction } from \"../js\";\nimport { values } from \"../values.config\";\n\nexport const featureBuilderAPI = {\n\tgetFeatureDefinitions: (site) => {\n\t\tconst url = getUrl(values.serviceKey, values.api.getDefinitions, { site });\n\n\t\tconst request = {\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t};\n\n\t\treturn authedFunction(request)\n\t\t\t.then((response) => {\n\t\t\t\treturn response;\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tthrow error;\n\t\t\t});\n\t},\n\n\tgetFeatureListings: (site, featureDefinitionId = null) => {\n\t\tconst queryParams = { site };\n\t\tif (featureDefinitionId) {\n\t\t\tqueryParams.featureDefinitionId = featureDefinitionId;\n\t\t}\n\t\tconst url = getUrl(values.serviceKey, values.api.getListings, queryParams);\n\n\t\tconst request = {\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t};\n\n\t\treturn authedFunction(request)\n\t\t\t.then((response) => {\n\t\t\t\treturn response;\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tthrow error;\n\t\t\t});\n\t},\n\n\tgetSingleListing: (site, listingId) => {\n\t\tif (!listingId) {\n\t\t\treturn Promise.reject(new Error(\"Listing ID is required\"));\n\t\t}\n\t\tconst url = getUrl(values.serviceKey, values.api.getSingleListing, {\n\t\t\tsite,\n\t\t\tid: listingId,\n\t\t});\n\t\treturn authedFunction({\n\t\t\tmethod: \"GET\",\n\t\t\turl,\n\t\t});\n\t},\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,UAAU;AACjC,SAASC,cAAc,QAAQ,OAAO;AACtC,SAASC,MAAM,QAAQ,kBAAkB;AAEzC,OAAO,MAAMC,iBAAiB,GAAG;EAChCC,qBAAqB,EAAGC,IAAI,IAAK;IAChC,MAAMC,GAAG,GAAGN,MAAM,CAACE,MAAM,CAACK,UAAU,EAAEL,MAAM,CAACM,GAAG,CAACC,cAAc,EAAE;MAAEJ;IAAK,CAAC,CAAC;IAE1E,MAAMK,OAAO,GAAG;MACfC,MAAM,EAAE,KAAK;MACbL;IACD,CAAC;IAED,OAAOL,cAAc,CAACS,OAAO,CAAC,CAC5BE,IAAI,CAAEC,QAAQ,IAAK;MACnB,OAAOA,QAAQ;IAChB,CAAC,CAAC,CACDC,KAAK,CAAEC,KAAK,IAAK;MACjB,MAAMA,KAAK;IACZ,CAAC,CAAC;EACJ,CAAC;EAEDC,kBAAkB,EAAEA,CAACX,IAAI,EAAEY,mBAAmB,GAAG,IAAI,KAAK;IACzD,MAAMC,WAAW,GAAG;MAAEb;IAAK,CAAC;IAC5B,IAAIY,mBAAmB,EAAE;MACxBC,WAAW,CAACD,mBAAmB,GAAGA,mBAAmB;IACtD;IACA,MAAMX,GAAG,GAAGN,MAAM,CAACE,MAAM,CAACK,UAAU,EAAEL,MAAM,CAACM,GAAG,CAACW,WAAW,EAAED,WAAW,CAAC;IAE1E,MAAMR,OAAO,GAAG;MACfC,MAAM,EAAE,KAAK;MACbL;IACD,CAAC;IAED,OAAOL,cAAc,CAACS,OAAO,CAAC,CAC5BE,IAAI,CAAEC,QAAQ,IAAK;MACnB,OAAOA,QAAQ;IAChB,CAAC,CAAC,CACDC,KAAK,CAAEC,KAAK,IAAK;MACjB,MAAMA,KAAK;IACZ,CAAC,CAAC;EACJ,CAAC;EAEDK,gBAAgB,EAAEA,CAACf,IAAI,EAAEgB,SAAS,KAAK;IACtC,IAAI,CAACA,SAAS,EAAE;MACf,OAAOC,OAAO,CAACC,MAAM,CAAC,IAAIC,KAAK,CAAC,wBAAwB,CAAC,CAAC;IAC3D;IACA,MAAMlB,GAAG,GAAGN,MAAM,CAACE,MAAM,CAACK,UAAU,EAAEL,MAAM,CAACM,GAAG,CAACY,gBAAgB,EAAE;MAClEf,IAAI;MACJoB,EAAE,EAAEJ;IACL,CAAC,CAAC;IACF,OAAOpB,cAAc,CAAC;MACrBU,MAAM,EAAE,KAAK;MACbL;IACD,CAAC,CAAC;EACH;AACD,CAAC","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@plusscommunities/pluss-feature-builder-app-d",
-	"version": "1.0.1-beta.3",
+	"version": "1.0.1-beta.5",
 	"description": "Feature Builder mobile extension for displaying custom features",
 	"main": "dist/module/index.js",
 	"module": "dist/module/index.js",
@@ -19,7 +19,7 @@
 		"upload:p": "npm run patch && npm run upload",
 		"copy:add": "run(){ ext=${1:-default}; test -f src/values.config.$ext.js || cp src/values.config.default.js src/values.config.$ext.js; }; run",
 		"copy:get": "echo $npm_package_name",
-		"copy:set": "run(){ target='@plusscommunities/pluss-feature-builder-app-a'; ext=${1:-default}; [ $ext == 'default' ] && replace=$target || replace=$target'-'$ext; echo 'Setting target to '$replace; test -f src/values.config.$ext.js && cp -f src/values.config.$ext.js src/values.config.js; sed -i '' -e 's/'$target'.*\"/'$replace'\"/g' package.json; }; run",
+		"copy:set": "run(){ target='@plusscommunities/pluss-feature-builder-app'; ext=${1:-default}; [ $ext == 'default' ] && replace=$target || replace=$target'-'$ext; echo 'Setting target to '$replace; test -f src/values.config.$ext.js && cp -f src/values.config.$ext.js src/values.config.js; sed -i '' -e 's/'$target'.*\"/'$replace'\"/g' package.json; }; run",
 		"copy:upload": "npm run patch; for file in `ls ./src/values.config.*.js`; do dup=`echo $file | sed 's/.*values\\.config\\.\\(.*\\)\\.js/\\1/'`; npm run copy:set $dup; npm run upload; done; npm run copy:set;",
 		"copy:betaupload": "npm run betapatch; for file in `ls ./src/values.config.*.js`; do dup=`echo $file | sed 's/.*values\\.config\\.\\(.*\\)\\.js/\\1/'`; npm run copy:set $dup; npm run betaupload; done; npm run copy:set;"
 	},

package/src/actions/featureBuilderActions.js

@@ -43,6 +43,7 @@ export const loadTargetFeature = () => {
 			const state = getState();
 			const site = state.user?.site;
 			const targetId = values.targetFeatureDefinitionId;
+
 			const defResponse = await featureBuilderAPI.getFeatureDefinitions(site);
 			const allDefinitions = defResponse.data.featureDefinitions || [];
 
@@ -69,17 +70,19 @@ export const loadTargetFeature = () => {
 			// Filter out soft-deleted items at the Redux level
 			const listings = rawListings.filter((listing) => !listing.deletedAt);
 
+			const payload = {
+				feature: flattenedFeature,
+				listings: listings,
+			};
 			dispatch({
 				type: FeatureBuilderActionTypes.LOAD_SUCCESS,
-				payload: {
-					feature: flattenedFeature,
-					listings: listings,
-				},
+				payload,
 			});
 
 			// Update strings store with feature definition title and icon
 			dispatch(updateFeatureBuilderStringAndIconFromDefinition());
 		} catch (error) {
+			console.error('FeatureBuilder Actions - Error in loadTargetFeature:', error);
 			dispatch({
 				type: FeatureBuilderActionTypes.FAILURE,
 				payload: error.message || "Failed to load feature.",

package/src/actions/featureBuilderStringsActions.js

@@ -1,4 +1,4 @@
-import { selectFeatureDefinition } from "../reducers/featureBuilderReducer";
+import { selectFeatureDefinition } from "../utils/selectors";
 import { values } from "../values.config";
 
 // IMPORTANT: Using local UPDATE_STRINGS action type to make extension self-contained
@@ -9,20 +9,12 @@ export const UPDATE_STRINGS = "UPDATE_STRINGS";
  * Updates the feature builder's menu text in the global strings store
  * This ensures UI components use the dynamic title from feature definition
  */
-export const updateFeatureBuilderString = (title) => (dispatch, getState) => {
-	const currentStrings = getState().strings?.config || {};
-
-	const updatedStrings = {
-		...currentStrings,
-		featureTitles: {
-			...currentStrings.featureTitles,
-			[values.featureKey]: title || values.featureName,
-		},
-	};
-
+export const updateFeatureBuilderString = (title) => (dispatch) => {
 	dispatch({
 		type: UPDATE_STRINGS,
-		payload: updatedStrings,
+		payload: {
+			featureTitles: { [values.featureKey]: title || values.featureName }
+		},
 	});
 };
 
@@ -45,19 +37,12 @@ export const updateFeatureBuilderStringFromDefinition =
  * Updates the feature builder icon in the global strings store
  * This ensures UI components use the dynamic icon from the feature definition
  */
-export const updateFeatureBuilderIcon = (icon) => (dispatch, getState) => {
-	const currentStrings = getState().strings?.config || {};
-	const updatedStrings = {
-		...currentStrings,
-		featureIcons: {
-			...currentStrings.featureIcons,
-			[values.featureKey]: icon,
-		},
-	};
-
+export const updateFeatureBuilderIcon = (icon) => (dispatch) => {
 	dispatch({
 		type: UPDATE_STRINGS,
-		payload: updatedStrings,
+		payload: {
+			featureIcons: { [values.featureKey]: icon }
+		},
 	});
 };
 
@@ -77,19 +62,12 @@ export const updateFeatureBuilderIconFromDefinition =
  * This ensures UI components use the dynamic grid icon from the feature definition
  */
 export const updateFeatureBuilderGridIcon =
-	(gridIcon) => (dispatch, getState) => {
-		const currentStrings = getState().strings?.config || {};
-		const updatedStrings = {
-			...currentStrings,
-			featureIcons: {
-				...currentStrings.featureIcons,
-				[values.featureKey]: gridIcon,
-			},
-		};
-
+	(gridIcon) => (dispatch) => {
 		dispatch({
 			type: UPDATE_STRINGS,
-			payload: updatedStrings,
+			payload: {
+				featureIcons: { [values.featureKey]: gridIcon }
+			},
 		});
 	};
 

package/src/components/FeatureDetailScreen.js

@@ -28,7 +28,7 @@ import {
 import { TEXT_MID, LINEGREY } from "../js/Colors";
 import FileDownload from "./FileDownload";
 import { values } from "../values.config";
-import { selectFeatureDefinition } from "../reducers/featureBuilderReducer";
+import { selectFeatureDefinition } from "../utils/selectors";
 
 import Constants from "expo-constants";
 import { InlineButton } from "./common";

package/src/components/WidgetGrid.js

@@ -11,7 +11,7 @@ import _ from "lodash";
 import { Services } from "../feature.config";
 import { Components } from "../core.config";
 import { values } from "../values.config";
-import { selectActiveFeatureDefinitions } from "../reducers/featureBuilderReducer";
+import { selectActiveFeatureDefinitions } from "../utils/selectors";
 import { getTargetFeatureDefinition } from "../utils/featureSelectors";
 import { SPACING } from "../js/spacing";
 import { getMainBrandingColourFromState } from "../js";
@@ -35,6 +35,10 @@ class WidgetGrid extends Component {
 		}
 	}
 
+	componentWillUnmount() {
+		// Component cleanup
+	}
+
 	refresh = () => {
 		this.onLoadingChanged(true, async () => {
 			try {
@@ -46,7 +50,7 @@ class WidgetGrid extends Component {
 					() => this.props.getState,
 				);
 			} catch (error) {
-				// Silently handle refresh errors
+				console.error('FeatureBuilder WidgetGrid - Error in refresh:', error);
 			} finally {
 				this.onLoadingChanged(false);
 			}

package/src/components/WidgetLarge.js

@@ -13,7 +13,10 @@ import { Icon } from "react-native-elements";
 import { Services } from "../feature.config";
 import { Components, Colours } from "../core.config";
 import { values } from "../values.config";
-import { selectListings, selectFeatureDefinition } from "../reducers/featureBuilderReducer";
+import {
+	selectListings,
+	selectFeatureDefinition,
+} from "../utils/selectors";
 import { SPACING } from "../js/spacing";
 import { getMainBrandingColourFromState } from "../js";
 import { getSummaryFieldValue } from "../js/helpers";
@@ -38,13 +41,8 @@ class WidgetLarge extends Component {
 		const { options, featureDefinition } = this.props;
 		if (options && !_.isEmpty(options.Title)) return options.Title;
 		// Use feature definition title
-		if (
-			featureDefinition?.title ||
-			featureDefinition?.displayName
-		) {
-			return (
-				featureDefinition.title || featureDefinition.displayName
-			);
+		if (featureDefinition?.title || featureDefinition?.displayName) {
+			return featureDefinition.title || featureDefinition.displayName;
 		}
 		return values.featureName || "Custom Features";
 	};

package/src/components/WidgetSmall.js

@@ -13,7 +13,10 @@ import { Icon } from "react-native-elements";
 import { Services } from "../feature.config";
 import { Components, Colours } from "../core.config";
 import { values } from "../values.config";
-import { selectListings, selectFeatureDefinition } from "../reducers/featureBuilderReducer";
+import {
+	selectListings,
+	selectFeatureDefinition,
+} from "../utils/selectors";
 import { SPACING } from "../js/spacing";
 import { getMainBrandingColourFromState } from "../js";
 import { getSummaryFieldValue } from "../js/helpers";
@@ -38,13 +41,8 @@ class WidgetSmall extends Component {
 		const { options, featureDefinition } = this.props;
 		if (options && !_.isEmpty(options.Title)) return options.Title;
 		// Use feature definition title
-		if (
-			featureDefinition?.title ||
-			featureDefinition?.displayName
-		) {
-			return (
-				featureDefinition.title || featureDefinition.displayName
-			);
+		if (featureDefinition?.title || featureDefinition?.displayName) {
+			return featureDefinition.title || featureDefinition.displayName;
 		}
 		return values.featureName || "Features";
 	};
@@ -196,9 +194,7 @@ class WidgetSmall extends Component {
 					>
 						<View style={[styles.borderContainer, styles.viewMoreContainer]}>
 							<Text style={styles.viewMoreText}>View all</Text>
-							<Text style={styles.viewMoreCount}>
-								{listings.length} items
-							</Text>
+							<Text style={styles.viewMoreCount}>{listings.length} items</Text>
 						</View>
 					</TouchableOpacity>
 				)}

package/src/components/common/index.js

@@ -1,7 +1,7 @@
 import { Components } from "../../core.config";
 
 export const InlineButton = Components.InlineButton;
-export const ProfilePic = Components.ProfilePic;
+// export const ProfilePic = Components.ProfilePic;  // Disabled due to circular dependency in core-app package
 export const EmptyStateMain = Components.EmptyStateMain;
 export const Spinner = Components.Spinner;
 export const MiddlePopup = Components.MiddlePopup;

package/src/feature.config.js

@@ -1,7 +1,9 @@
-import _ from "lodash";
+import _ from 'lodash';
 // import * as PlussCore from '../../pluss-core/src';
-import * as PlussCore from "@plusscommunities/pluss-core-app";
-import { values } from "./values.config";
+import * as PlussCore from '@plusscommunities/pluss-core-app';
+import { values } from './values.config';
+import { loadTargetFeature } from './actions/featureBuilderActions';
+import { updateFeatureBuilderString, updateFeatureBuilderIcon } from './actions/featureBuilderStringsActions';
 
 export { PlussCore };
 
@@ -13,13 +15,6 @@ export const BaseComponents = {
 	NotificationBell: null,
 };
 
-// These will be set when the components are imported in index.js
-export const setWidgets = (small, large, grid) => {
-	WidgetSmall = small;
-	WidgetLarge = large;
-	WidgetGrid = grid;
-};
-
 const fetchFeatured = async (site, store, props) => {
 	// No-op: listings are already loaded by loadTargetFeature()
 	return [];
@@ -32,19 +27,15 @@ const getFeatured = (state, features) => {
 	if (!listings || listings.length === 0) return [];
 
 	// Get latest 3-4 listings, sorted by createdAt or updatedAt
-	const latestListings = _.orderBy(
-		listings,
-		[(item) => item.createdAt || item.updatedAt],
-		["desc"]
-	).slice(0, 4);
+	const latestListings = _.orderBy(listings, [item => item.createdAt || item.updatedAt], ['desc']).slice(0, 4);
 
-	return latestListings.map((listing) => {
+	return latestListings.map(listing => {
 		const title = listing.fields?.[values.mandatoryFields.title] || values.labels.defaultTitle;
 		const imageField = listing.fields?.[values.mandatoryFields.featureImage];
 		let imageSource = null;
 
 		if (imageField) {
-			if (typeof imageField === "string") {
+			if (typeof imageField === 'string') {
 				imageSource = imageField;
 			} else if (imageField?.url) {
 				imageSource = imageField.url;
@@ -57,7 +48,7 @@ const getFeatured = (state, features) => {
 			id: listing.id,
 			type: values.featureKey,
 			title: title,
-			description: "",
+			description: '',
 			image: imageSource,
 			date: listing.createdAt || listing.updatedAt || 0,
 			data: listing,
@@ -67,7 +58,7 @@ const getFeatured = (state, features) => {
 
 const FeatureConfig = {
 	key: values.featureKey,
-	aliases: ["feature-builder", "custom-features"],
+	aliases: ['feature-builder', 'custom-features'],
 	title: values.featureName,
 
 	gridMenu: {
@@ -90,7 +81,7 @@ const FeatureConfig = {
 		prop: values.featureKey,
 		reducer: {
 			key: values.featureKey,
-			prop: "list",
+			prop: 'list',
 		},
 		updateKey: values.featureKey,
 		fetch: fetchFeatured,
@@ -100,19 +91,19 @@ const FeatureConfig = {
 	hideTabBar: [], // No special tab bar hiding needed
 
 	env: {
-		baseStage: "",
-		baseAPIUrl: "",
+		baseStage: '',
+		baseAPIUrl: '',
 		hasGradientHeader: false,
-		defaultProfileImage: "",
-		tinyChatDefault: "",
-		baseUploadsUrl: "",
+		defaultProfileImage: '',
+		tinyChatDefault: '',
+		baseUploadsUrl: '',
 		allowMediaDownload: false,
 		allowMediaSharing: false,
-		awsUploadsBucket: "",
-		awsStorageBucket: "",
-		preferredSite: "",
+		awsUploadsBucket: '',
+		awsStorageBucket: '',
+		preferredSite: '',
 		strings: {},
-		newEventDefaults: "",
+		newEventDefaults: '',
 		defaultAllowComments: true,
 	},
 
@@ -122,6 +113,21 @@ const FeatureConfig = {
 		BaseComponents.NotificationBell = notificationBell;
 		PlussCore.Config.init(environment, navigation);
 	},
+
+	afterStoreInit: (dispatch, getState) => {
+		// Get the site from state (guaranteed to be available due to polling)
+		const site = getState().user?.site;
+
+		if (site) {
+			// Show loading state before fetching
+			dispatch(updateFeatureBuilderString('Loading...'));
+			dispatch(updateFeatureBuilderIcon('spinner'));
+
+			// Load the target feature definition and listings
+			// This will also update the title and icon from the definition
+			dispatch(loadTargetFeature());
+		}
+	},
 };
 
 export default FeatureConfig;

package/src/index.js

@@ -1,27 +1,21 @@
-import FeatureConfig, { setWidgets } from "./feature.config";
-import featureBuilderReducer from "./reducers/featureBuilderReducer";
-import FeatureListScreen from "./components/FeatureListScreen";
-import FeatureDetailScreen from "./components/FeatureDetailScreen";
-import WidgetSmall from "./components/WidgetSmall";
-import WidgetLarge from "./components/WidgetLarge";
-import WidgetGrid from "./components/WidgetGrid";
-import { values } from "./values.config";
-
-// Set widgets in the config to avoid circular dependencies
-setWidgets(WidgetSmall, WidgetLarge, WidgetGrid);
+import FeatureConfig from './feature.config';
+import featureBuilderReducer from './reducers/featureBuilderReducer';
+import FeatureListScreen from './components/FeatureListScreen';
+import FeatureDetailScreen from './components/FeatureDetailScreen';
+import { values } from './values.config';
 
 export const Reducers = {
 	[values.reducerKey]: featureBuilderReducer,
 };
 
 export const Screens = {
-	FeatureBuilderList: FeatureListScreen,
-	FeatureBuilderDetail: FeatureDetailScreen,
+	[values.screens.featureList]: FeatureListScreen,
+	[values.screens.featureDetail]: FeatureDetailScreen,
 };
 
-export { default as Config } from "./feature.config";
-export { default as WidgetSmall } from "./components/WidgetSmall";
-export { default as WidgetLarge } from "./components/WidgetLarge";
-export { default as WidgetGrid } from "./components/WidgetGrid";
+export { default as Config } from './feature.config';
+export { default as WidgetSmall } from './components/WidgetSmall';
+export { default as WidgetLarge } from './components/WidgetLarge';
+export { default as WidgetGrid } from './components/WidgetGrid';
 
 export { FeatureConfig };

package/src/reducers/featureBuilderReducer.js

@@ -1,4 +1,3 @@
-import { values } from "../values.config";
 import { FeatureBuilderActionTypes } from "../actions/featureBuilderActions";
 
 const initialState = {
@@ -31,34 +30,3 @@ const featureBuilderReducer = (state = initialState, action) => {
 };
 
 export default featureBuilderReducer;
-
-// --- Selectors ---
-
-// Use values.reducerKey to access the correct state slice for multi-instance support
-export const selectFeature = (state) => {
-	return state[values.reducerKey]?.feature;
-};
-
-export const selectFeatureDefinition = (state) => {
-	return state[values.reducerKey]?.feature;
-};
-
-export const selectListings = (state) => {
-	return state[values.reducerKey]?.listings || [];
-};
-
-export const selectListingsForFeature = (state) => {
-	return state[values.reducerKey]?.listings || [];
-};
-
-// Legacy Helpers for Widgets
-export const selectActiveFeatureDefinitions = (state) => {
-	return state[values.reducerKey]?.feature ? [state[values.reducerKey].feature] : [];
-};
-
-export const selectFeaturesWithListings = (state) => {
-	const feature = state[values.reducerKey]?.feature;
-	const listings = state[values.reducerKey]?.listings;
-	if (!feature || !listings) return [];
-	return [{ definition: feature, listings: listings }];
-};

package/src/utils/featureSelectors.js

@@ -1,4 +1,4 @@
-import { selectFeatureDefinition } from "../reducers/featureBuilderReducer";
+import { selectFeatureDefinition } from "./selectors";
 
 /**
  * Get the target feature definition from the store

package/src/utils/selectors.js

@@ -0,0 +1,34 @@
+import { values } from "../values.config";
+
+// --- Selectors ---
+// Use values.reducerKey to access the correct state slice for multi-instance support
+
+export const selectFeature = (state) => {
+	return state[values.reducerKey]?.feature;
+};
+
+export const selectFeatureDefinition = (state) => {
+	return state[values.reducerKey]?.feature;
+};
+
+export const selectListings = (state) => {
+	return state[values.reducerKey]?.listings || [];
+};
+
+export const selectListingsForFeature = (state) => {
+	return state[values.reducerKey]?.listings || [];
+};
+
+// Legacy Helpers for Widgets
+export const selectActiveFeatureDefinitions = (state) => {
+	return state[values.reducerKey]?.feature
+		? [state[values.reducerKey].feature]
+		: [];
+};
+
+export const selectFeaturesWithListings = (state) => {
+	const feature = state[values.reducerKey]?.feature;
+	const listings = state[values.reducerKey]?.listings;
+	if (!feature || !listings) return [];
+	return [{ definition: feature, listings: listings }];
+};

package/src/values.config.a.js

@@ -1,47 +1,30 @@
 export const values = {
-	// Feature identification
 	featureKey: "feature-builder-a",
 	featureName: "Feature A",
 	targetFeatureDefinitionId: "feature-builder-a-default",
-
-	// Redux state management
-	reducerKey: "featureBuilderA", // Redux state slice name (must be unique per instance)
-
-	// API routing
-	apiNamespace: "feature-builder-a", // API endpoint prefix for multi-instance routing
-
-	// Notifications
-	notificationKey: "feature-builder-a", // Key for notifications.dataUpdated[...]
-
-	// Default brand colors (single source of truth)
+	reducerKey: "featureBuilderA",
+	serviceKey: "feature-builder",
+	notificationKey: "feature-builder-a",
 	colors: {
 		defaultBrandMain: "#FF6363",
 		defaultBrandDark: "#D13636",
 		defaultBrandLight: "#FCE1E1",
 	},
-
-	// Screen names
 	screens: {
 		featureList: "FeatureBuilderListA",
 		featureDetail: "FeatureBuilderDetailA",
 	},
-
-	// API endpoints
 	api: {
 		getDefinitions: "definition/get/all",
 		getListings: "listing/get/all",
 		getSingleListing: "listing/get/single",
 	},
-
-	// Layout types
 	layoutTypes: {
 		round: "round",
 		square: "square",
 		condensed: "condensed",
 		feature: "feature",
 	},
-
-	// Field types
 	fieldTypes: {
 		string: "string",
 		number: "number",
@@ -50,21 +33,15 @@ export const values = {
 		pdf: "pdf",
 		link: "link",
 	},
-
-	// Mandatory field IDs
 	mandatoryFields: {
 		title: "mandatory-title",
 		featureImage: "mandatory-feature-image",
 	},
-
-	// Action types (with suffix to prevent collisions between instances)
 	actions: {
 		LOADING: "FB_LOADING_A",
 		LOAD_SUCCESS: "FB_LOAD_SUCCESS_A",
 		FAILURE: "FB_FAILURE_A",
 	},
-
-	// Navigation
 	navigation: {
 		gridMenu: {
 			icon: "settings",
@@ -72,28 +49,20 @@ export const values = {
 			navigate: "FeatureBuilderListA",
 		},
 	},
-
-	// Default values
 	defaults: {
 		itemsPerWidget: 2,
-		loadingTimeout: 30000, // 30 seconds
+		loadingTimeout: 30000,
 	},
-
-	// Widget configuration
 	widget: {
 		maxItems: 2,
 		itemMinWidth: 120,
 		itemMaxWidth: 150,
 	},
-
-	// UI dimensions
 	dimensions: {
 		cardHeight: 125,
 		imageSize: 95,
 		imageBorderRadius: 47.5,
 	},
-
-	// Common text labels
 	labels: {
 		emptyState: "No custom features available",
 		defaultTitle: "Untitled",