You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
* Search result that will be rendered in this view. Will be provided by FairDOElasticSearch
21
+
*/
34
22
result: SearchResult
23
+
24
+
/**
25
+
* The elastic field where the title of the card will be read from
26
+
*/
35
27
titleField?: string
28
+
29
+
/**
30
+
* The elastic field where the description of the card will be read from
31
+
*/
36
32
descriptionField?: string
33
+
34
+
/**
35
+
* The elastic field where the image of the card will be read from. Will directly be passed to the `src` attribute of an `img` tag
36
+
*/
37
37
imageField?: string
38
+
39
+
/**
40
+
* Enable this option to invert the image on dark mode. This is useful for greyscale schematics.
41
+
*/
38
42
invertImageInDarkMode?: boolean
43
+
44
+
/**
45
+
* The elastic field where the digital object location (the target page of the `Open` button) will be read from
46
+
*/
39
47
digitalObjectLocationField?: string
48
+
49
+
/**
50
+
* The elastic field where the PID of the current FDO will be read from. Can be omitted if you don't have a PID
51
+
*/
40
52
pidField?: string
53
+
54
+
/**
55
+
* The elastic field where the related items of the current FDO will be read from. Should be an array of PIDs or otherwise unique identifiers. Will be displayed in a related items graph.
56
+
*/
41
57
relatedItemPidsField?: string
58
+
59
+
/**
60
+
* Options for prefetching of related items in the relations graph. It is recommended to defined this if the default settings don't work properly.
* The elastic field where the unique identifier of the parent item (metadata item) of the current FDO will be read from. Will be accessible via a `Find Metadata` button
66
+
*/
43
67
parentItemPidField?: string
68
+
69
+
/**
70
+
* The elastic field where the creation date of the FDO will be read from. Will be parsed as an ISO String.
71
+
*/
44
72
creationDateField?: string
45
-
identifierField?: string
73
+
74
+
/**
75
+
* The elastic field where an additional identifier will be read from. You don't need to provide this if you don't have any additional identifiers apart from the PID.
76
+
*/
77
+
additionalIdentifierField?: string
78
+
79
+
/**
80
+
* Define custom tags to display on the card. Each tag displays the information from one field.
81
+
*/
46
82
tags?: Omit<GenericResultViewTagProps,"result">[]
83
+
84
+
/**
85
+
* Whether to show the open in FairDOScope button in the dropdown
86
+
*/
47
87
showOpenInFairDoScope?: boolean
48
-
}){
88
+
}
89
+
90
+
/**
91
+
* Configurable result view component that can be customized for specific use cases. Will display a card for each search result from elastic. If this component
92
+
* doesn't fit your needs, feel free to implement your own result view.
Depending on your use case, you will have different needs for authenticating users. This package (as well as the underlying elasticsearch adapter) provide two ways to achieve this:
11
+
12
+
1. Authentication with an access code from an identity provider (like keycloak)
13
+
2. Authentication with an API Key (not recommended)
14
+
15
+
While the first option requires significantly more work, the second option can't be considered secure, as your API Key will have to be provided to all users of the app. Feel free to use the second option in development.
16
+
17
+
### via Access Code
18
+
19
+
Set up authentication in your app depending on your identity provider. Then you can simply pass the access code to the search component:
20
+
21
+
<Sourcecode={`
22
+
function MyComponent() {
23
+
const myAccessToken = useAccessToken() // This will depend on your authentication library
24
+
25
+
const config: FairDOConfig = useMemo(() => ({
26
+
// ...
27
+
host: "https://example.org/elastic-auth-proxy"
28
+
connectionOptions: {
29
+
headers: {
30
+
Authentication: myAccessToken
31
+
}
32
+
}
33
+
}), [myAccessToken])
34
+
35
+
// ...
36
+
}
37
+
`} />
38
+
39
+
You will have to run a proxy server that received the requests from the search component and checks the authentication header. The proxy server should then forward the request to a protected elasticsearch instance.
40
+
41
+
Depending on your authentication service, you have to make sure that the access token is refreshed when it becomes invalid.
42
+
43
+
### via API Key
44
+
45
+
Set up an API Key in the management interface of your elasticsearch instance. Then pass the API Key to the config:
46
+
47
+
<Sourcecode={`
48
+
function MyComponent() {
49
+
const config: FairDOConfig = useMemo(() => ({
50
+
// ...
51
+
apiKey: "your key here"
52
+
}), [])
53
+
54
+
// ...
55
+
}
56
+
`} />
57
+
58
+
The API Key will be visible to all users of your app. This approach is not recommended in production.
0 commit comments