Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Release/2.23.0 #1414

Merged
merged 42 commits into from
Jan 6, 2025
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
42 commits
Select commit Hold shift + click to select a range
187bf3a
feat(@dpc-sdp/ripple-tide-landing-page): :sparkles: new component build
waitingallday Nov 20, 2024
9b3cc0e
feat(@dpc-sdp/ripple-tide-search): wip for location search refactor
jeffdowdle Nov 22, 2024
8f51c85
chore(@dpc-sdp/ripple-tide-landing-page): removed search banner examples
jeffdowdle Nov 22, 2024
f5ec570
feat(@dpc-sdp/ripple-ui-core): move and update RplSearchBanner
lambry Nov 24, 2024
8582c58
Merge branch 'release/2.22.0' into feature/SD-403-decoupled-map-searc…
dylankelly Dec 5, 2024
641e5d5
feat(@dpc-sdp/ripple-ui-forms): add search support for dropdowns
lambry Dec 6, 2024
043978a
feat(@dpc-sdp/ripple-tide-search): add page detail to search, sitemap…
lambry Dec 9, 2024
a5341bd
chore: :coffin: remove unused action
waitingallday Dec 9, 2024
2f66c51
Merge pull request #1403 from dpc-sdp/task/remove-unused-action
waitingallday Dec 9, 2024
64d172b
Merge branch 'release/2.23.0' of https://github.com/dpc-sdp/ripple-fr…
jeffdowdle Dec 9, 2024
de0325f
chore(@dpc-sdp/ripple-tide-webform): update tide_webform_captcha key
lambry Dec 9, 2024
7f36117
fix(@dpc-sdp/ripple-tide-webform): add await to webformApi.getWebfor…
lambry Dec 9, 2024
5db8989
fix(nuxt-app): temporary fix for HMR
lambry Dec 9, 2024
1cbf987
Merge pull request #1402 from dpc-sdp/feature/static-page-titles
dylankelly Dec 9, 2024
81d8bb7
style(@dpc-sdp/ripple-ui-forms): design feedback
lambry Dec 10, 2024
2237a7f
Merge branch 'release/2.23.0' into feature/dropdown-combobox
lambry Dec 10, 2024
c6698cd
feat(@dpc-sdp/ripple-ui-forms): use selectionStart for handling the l…
lambry Dec 10, 2024
39f0cc3
feat(@dpc-sdp/ripple-tide-landing-page): moved data driven components…
jeffdowdle Dec 11, 2024
2c24008
Merge pull request #1404 from dpc-sdp/feature/tide-recaptcha-rename
lambry Dec 11, 2024
110f925
fix(@dpc-sdp/ripple-tide-search): fixed map sidepanel needing a uniqu…
jeffdowdle Dec 11, 2024
b892794
Use a responsively hidden div instead of pseudo-element content to sh…
bgilhome-now Dec 12, 2024
cea62ac
Use a single div with v-html for mobile label whether `isLabelHTML` i…
bgilhome-now Dec 12, 2024
21095d6
Re-add data-label on data table row so tests pass.
bgilhome-now Dec 12, 2024
55bfe45
Remove extraneous CSS rule for data table mobile label.
bgilhome-now Dec 12, 2024
c2e3fdc
Use field 'name' attribute (if set) as key in webform mapping, else u…
bgilhome-now Dec 12, 2024
5d47776
Merge pull request #1407 from dpc-sdp/bugfix/SD-525-map-sidepanel-hig…
jeffdowdle Dec 12, 2024
28d0589
feat(@dpc-sdp/ripple-tide-grant): update grants listing sort and stat…
lambry Dec 16, 2024
9ff95ac
Merge pull request #1409 from bgilhome-now/feature/1408-data-table-ht…
waitingallday Dec 16, 2024
e65d674
Merge pull request #1411 from bgilhome-now/feature/1410-webform-mappi…
waitingallday Dec 16, 2024
0dc2178
feat(@dpc-sdp/ripple-ui-forms): display items in the order they're se…
lambry Dec 16, 2024
882db00
Merge pull request #1405 from dpc-sdp/bugfix/nuxt-console-errors
dylankelly Dec 16, 2024
064b5bb
Merge pull request #1406 from dpc-sdp/feature/SD-569-data-driven-comp…
dylankelly Dec 16, 2024
0fa76b8
Merge pull request #1399 from dpc-sdp/feature/dropdown-combobox
dylankelly Dec 16, 2024
78688e7
feat(@dpc-sdp/ripple-tide-grant): display status first, add closes to…
lambry Dec 16, 2024
4e4dbed
fix(@dpc-sdp/ripple-tide-grant): update formatting test
lambry Dec 17, 2024
20c2925
Merge branch 'release/2.23.0' into feature/SD-403-decoupled-map-searc…
jeffdowdle Dec 17, 2024
339a312
test(@dpc-sdp/ripple-tide-search): added tests for map search banner
jeffdowdle Dec 17, 2024
937003b
Merge pull request #1412 from dpc-sdp/feature/grants-improvements
lambry Dec 18, 2024
8dfdcdf
fix(@dpc-sdp/ripple-ui-forms): always set searchInput focus
lambry Dec 19, 2024
824bb99
Merge pull request #1413 from dpc-sdp/feature/dropdown-combobox
lambry Dec 19, 2024
1cdae25
Merge pull request #1388 from dpc-sdp/feature/SD-403-decoupled-map-se…
dylankelly Dec 19, 2024
ea62ddb
chore: release 2.23.0
sdpdeploy Dec 19, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions examples/nuxt-app/layers/example-data-driven-component/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
## About this layer

An example of setting up a data driven component for testing purposes

Data driven components can be registered in the Nuxt `app.config` file:

```ts
export default defineAppConfig({
ripple: {
dataDrivenComponents: {
// add key of field_data_driven_component and value of component name to render
// eg: find_a_council_map: 'VicCouncilLookup'
example_ddc: 'ExampleDDC'
}
}
})
```

Note that the vue component (e.g. ExampleDDC) must be declared globally for this to work, see https://nuxt.com/docs/guide/directory-structure/components.
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
export default defineAppConfig({
ripple: {
featureFlags: {
contentCollectionSearchConnector: 'elasticsearch'
},
dataDrivenComponents: {
// add key of field_data_driven_component and value of component name to render
// eg: find_a_council_map: 'VicCouncilLookup'
example_ddc: 'ExampleDDC'
}
}
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<template>
<h3>{{ title }}</h3>
<div v-html="description" />
<p>{{ testCustomProp }}</p>
</template>

<script setup lang="ts">
interface Props {
title: string
description: string
testCustomProp: string
}

defineProps<Props>()
</script>
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { defineNuxtConfig } from 'nuxt/config'

export default defineNuxtConfig({})
3 changes: 2 additions & 1 deletion examples/nuxt-app/nuxt.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,8 @@ export default defineNuxtConfig({
'./layers/example-components',
'./layers/fixture-api',
'./layers/map-features',
'./layers/ripple-ui-forms-ext'
'./layers/ripple-ui-forms-ext',
'./layers/example-data-driven-component'
],
// Nuxt devtools
sourcemap: true,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -209,3 +209,9 @@ Feature: Home page
Then the dataLayer should include the following events
| event | element_id | element_text | label | file_name | file_extension | type | component |
| file_download | page-component-1951 | Download it | Complex image | medium.png | png | image | rpl-media-embed |

@mockserver
Scenario: Page component - Data driven component
Then a custom data driven component with ID "3553540" should exist with title "Test data driven title" and have the properties
| description | testCustomProp |
| Test data driven desc | testCustomValue |
12 changes: 12 additions & 0 deletions examples/nuxt-app/test/fixtures/landingpage/home.json
Original file line number Diff line number Diff line change
Expand Up @@ -981,6 +981,18 @@
"allowFullscreen": true,
"showTitle": true
}
},
{
"uuid": "0aa14648-604d-4aab-833a-bbce065433f4",
"component": "ExampleDDC",
"id": "3553540",
"props": {
"title": "Test data driven title",
"description": "<p>Test data driven desc</p>",
"field": "example_ddc",
"component": "ExampleDDC",
"testCustomProp": "testCustomValue"
}
}
],
"meta": {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import { Then, DataTable } from '@badeball/cypress-cucumber-preprocessor'

Then(
'a custom data driven component with ID {string} should exist with title {string} and have the properties',
(id: string, title: string, dataTable: DataTable) => {
const data = dataTable.hashes()[0]

cy.get(`[data-component-id="${id}"]`).as('component')
cy.get('@component').should('exist')
cy.get(`@component`).should(
'have.attr',
'data-component-type',
'ExampleDDC'
)
cy.get('@component').within(() => {
cy.get(`h3`).should('have.text', title)
})

cy.get('@component').should('contain', data.description)
cy.get('@component').should('contain', data.testCustomProp)
}
)
Original file line number Diff line number Diff line change
Expand Up @@ -20,3 +20,4 @@ import './category-grid'
import './content-collection'
import './custom-collection'
import './social-share'
import './data-driven-component'
4 changes: 4 additions & 0 deletions packages/ripple-tide-landing-page/app.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@ export default defineAppConfig({
ripple: {
featureFlags: {
contentCollectionSearchConnector: 'elasticsearch'
},
dataDrivenComponents: {
// add key of field_data_driven_component and value of component name to render
// eg: find_a_council_map: 'VicCouncilLookup'
}
}
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<template>
<DevOnly>
<div class="rpl-callout callout-error">
<h3>Data driven component {{ component }} not found</h3>
<p>Check the component mapping for {{ field }} in app.config</p>
</div>
</DevOnly>
</template>

<script setup lang="ts">
interface Props {
component: string
field: string
}

defineProps<Props>()
</script>

<style>
.callout-error {
--rpl-clr-accent: var(--rpl-clr-error);
--rpl-clr-accent-alt: var(--rpl-clr-error-light);
}
</style>
4 changes: 3 additions & 1 deletion packages/ripple-tide-landing-page/mapping/components.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import complexImageMapping from './components/complex-image/complex-image-mappin
import dataTableMapping from './components/data-table/data-table-mapping'
import compactCardsMapping from './components/compact-cards/compact-cards-mapping'
import openFormsMapping from './components/openforms/openforms-mapping'
import dataDrivenComponentMapping from './components/data-driven-component/data-driven-component-mapping'

const mappings: {
[key: string]: {
Expand All @@ -45,7 +46,8 @@ const mappings: {
'paragraph--complex_image': complexImageMapping,
'paragraph--data_table': dataTableMapping,
'paragraph--compact_card_collection': compactCardsMapping,
'paragraph--form_embed_openforms': openFormsMapping
'paragraph--form_embed_openforms': openFormsMapping,
'paragraph--data_driven_component': dataDrivenComponentMapping
}

// Add reusable include on whitelisted paragraph types
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
/* eslint-disable no-prototype-builtins */
import type { TideDynamicPageComponent } from '@dpc-sdp/ripple-tide-api/types'
import { logger } from '@dpc-sdp/ripple-tide-api'
import { useAppConfig } from '#imports'

export interface ITideDataDrivenComponent {
component?: string
description: string
title: string
field?: string
data?: unknown
}

interface IDDCAppConfig {
ripple?: {
dataDrivenComponents?: Record<string, string>
}
}

export const dataDrivenComponentMapping = (
field: any
): TideDynamicPageComponent<ITideDataDrivenComponent> => {
const getComponent = (field: any) => {
const appConfig = useAppConfig() as IDDCAppConfig
if (
appConfig?.ripple?.dataDrivenComponents?.hasOwnProperty(
field.field_data_driven_component
)
) {
return appConfig.ripple.dataDrivenComponents[
field.field_data_driven_component
]
}
return 'TideLandingPageDataDrivenCmpError'
}
let dataProps = {}
try {
dataProps = JSON.parse(field.field_configuration)
} catch (error) {
logger.error(`Error parsing data driven component extra data`, error)
}

return {
component: getComponent(field),
id: `${field.drupal_internal__id}`,
props: {
title: field.field_paragraph_title,
description: field.field_paragraph_body?.processed,
field: field.field_data_driven_component,
component: getComponent(field),
...dataProps
}
}
}

export default {
includes: [],
mapping: dataDrivenComponentMapping,
contentTypes: ['landing_page']
}
Loading