URL mapping not working properly from controller.xql - xquery

I've been trying to forward the file to HTML template but it's not working. Here is the code in file.xql
{
for $resource in collection('/db/apps/myapp/data')
let $doc := request:get-parameter("filename", ())
let $uri := document-uri( root( $resource ) )
return
{document-uri( root( $resource ) )}
};
and here is controller.xql
if ($exist:path eq '') then
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<redirect url="{request:get-uri()}/"/>
</dispatch>
else if ($exist:path eq "/") then
(: forward root path to index.xql :)
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<redirect url="index.html"/>
</dispatch>
else if (ends-with($exist:resource, ".html")) then
(: the html page is run through view.xql to expand templates :)
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<view>
<forward url="{$exist:controller}/modules/view.xql"/>
</view>
<error-handler>
<forward url="{$exist:controller}/error-page.html" method="get"/>
<forward url="{$exist:controller}/modules/view.xql"/>
</error-handler>
</dispatch>
else if (contains($exist:path, "/data/")) then
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<forward url="{$exist:controller}/templates/file.html"/>
<view>
<forward url="{$exist:controller}/modules/view.xql">
<add-parameter name="filename" value="{$exist:resource}.xml"/>
</forward>
</view>
</dispatch>
But it goes to URL "http://localhost:8080/db/apps/myapp/data/let001.xml"
and not to "http://localhost:8080/db/apps/myapp/templates/file.html"
Any ideas what is wrong in the code?

Related

How to set textTransform to all components globally?

I want to capitalize all text in my muiv5 project. It should be default to capitalize unless stated in sx or styled on the component itself.
What I've tried is:
<ThemeProvider theme={theme}>
<IntlProvider
locale="en"
defaultLocale="en"
messages={AppLocale.en.messages}
>
<CssBaseline />
<GlobalStyles styles={{ root: { textTransform: "capitalize" } }} />
<Component {...pageProps} />
</IntlProvider>
</ThemeProvider>
But it doesn't work. Any best way to do this? Even createTheme is not working for me.
Note: I don't want to use makeStyles. Using Next.js.
You can allow all the children of body to inherit the textTransform value.
<GlobalStyles styles={{ body: { textTransform: "capitalize" } }} />

Next.js - How to hide navigation and footer component on 404 page?

import Footer from "./Footer";
import Navigation from "./Navigation";
import { useRouter } from "next/router";
function Layout({ children }) {
const router = useRouter();
return (
<>
{router.pathname !== "/*" && <Navigation />}
{/* {router.pathname !== "*" && <Navigation />} */}
<main className="main-content">{children}</main>
{router.pathname !== "/*" && <Footer />}
{/* {router.pathname !== "*" && <Footer />} */}
</>
);
}
export default Layout;
Unfortunately the methods with an asterisk do not work :/ ?!?
Thank you in advance and best regards for everyone ;-)
If you are not using a custom 404 page, the default router.pathname is _error so
{router.pathname !== "/_error" && <Navigation />}
should work.
If you are using custom 404 page (404.js inside /pages) router.pathname is /404.
If you reuse the built in error page router.pathname inside your page or component router.pathname would be the current page path.
Ex :
import Error from 'next/error'
const MyPage = ({isError = true})=>{
// pagepath would be something like pages/mypage
return isError ? <Error statusCode={"404"} /> : <p>My page </p>
}
export default MyPage
In this case both methods mentioned above wont work.
However i would not recommended to use this method.
I decided to add this code to serve other people who encounter the same problem. In my case, when we have custom 404 page , the solution looks like this =>
import Footer from "./Footer";
import Navigation from "./Navigation";
import { useRouter } from "next/router";
function Layout({ children }) {
const router = useRouter();
return (
<>
{router.pathname !== "/404" && <Navigation />}
<main className="main-content">{children}</main>
{router.pathname !== "/404" && <Footer />}
</>
);
}
export default Layout;

React-Native: Display/Render multiple images with snapshot.val()

I am trying to load multiple images in my react-native-app feed page. I have stored it in my database and am able to retrieve the data using snapshot.val(), however, I don't understand how to actually display/render it on the feed screen.
When I do console.log("CONSOLE.LOG --> Snapshot is: ", snapshot.val()), this is what I get
CONSOLE.LOG --> Snapshot is: Object {
"4aae-47bb-e0f7-36e2-7e66": Object {
"author": "edm9AAbPpFUWrO9HDXfV442QzSE2",
"caption": "Test 1",
"photo": Object {
"2e30-b971-5c62-0b68-837f": Object {
"url": "https://firebasestorage.googleapis.com/v0/b/...someURL...",
},
"38de-15f2-bb7b-b58d-e863": Object {
"url": "https://firebasestorage.googleapis.com/v0/b/...someURL...",
},
"94f2-1494-908f-c17a-5adc": Object {
"url": "https://firebasestorage.googleapis.com/v0/b/...someURL...",
},
},
"posted": 1562901067,
"vote": 1,
},
}
I am able to render "author", "caption", "posted", and "vote" by using a Flatlist like so:
<FlatList
refreshing={this.state.refresh}
onRefresh={this.loadNew}
data={this.state.photo_feed}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item, index }) => (
<View key={index}>
<View>
<Text>{item.posted}</Text>
<Text>{item.author}</Text>
</View>
<View>
<Image
source={{ uri: item.photo }}
/>
</View>
<View>
<Text>{item.caption}</Text>
<View>
<View>
<Text>Votes: {item.vote}</Text>
</View>
</View>
</View>
</View>
)}
/>
but I don't understand how I can loop through the 3 "url" in "photo"
<View>
<Image
source={{ uri: item.photo }}
/>
</View>
^ doesn't load any image
You will need to loop over the photo object's values and create Image component for each of the photoItem inside. Something like this might work,
<View>
{
Object.values(item.photo).map(photoItem => (
<Image source={{ uri: photoItem.url }} />
))
}
</View>
Hope that helps!

eXist-db getting query string from HTTP request

On my website (driven by eXist-db 4.4) I have a search page:
http://localhost:8081/exist/apps/deheresi/search
This contains a simple form that submits a search request like:
http://localhost:8081/exist/apps/deheresi/search?keyword=someword
The page is served up through templates in eXist-db which are triggered by controller.xqlreceiving the request:
else if (starts-with(lower-case($exist:path), "/search")) then
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<forward url="{$exist:controller}/search.html"/>
<view>
<forward url="{$exist:controller}/modules/view.xql">
<add-parameter name="searchterm" value="{$exist:resource}"/>
<add-parameter name="pagetype" value="search"/>
</forward>
</view>
</dispatch>
In this context, I would assume that $exist:resource would contain the some string which includes ?keyword=somewordor something to that effect (so that I can further parse the request). But nothing is being output to the parameter. I have a feeling I'm not understanding exactly how to get the query string from an http request in the eXist controller.
Many thanks in advance for any advice.
Just after I posted this I discovered https://exist-db.org/exist/apps/fundocs/view.html?uri=http://exist-db.org/xquery/request where
request:get-parameter($name as xs:string, $default-value as item()*) as xs:string*
Does exactly as needed, like this:
else if (starts-with(lower-case($exist:path), "/search")) then
<dispatch xmlns="http://exist.sourceforge.net/NS/exist">
<forward url="{$exist:controller}/search.html"/>
<view>
<forward url="{$exist:controller}/modules/view.xql">
<add-parameter name="searchterm" value="{request:get-parameter("keyword","")}"/>
<add-parameter name="pagetype" value="search"/>
</forward>
</view>
</dispatch>

How to add carousel for dynamic blocks from WordPress API in react native?

I am implementing react native app for woocommerce WordPress website. I need to add carousel for product images, price, name which is fetched from WordPress woocommerce API. The content from API is fetched and working fine but cannot integrate carousel.
What have I done yet?
render () {
const carr = <FlatList
data={this.state.data || []}
keyExtractor = {(x,i) =>i.toString()}
renderItem = {({item})=>
<Carousel
ref={(c) => { this._carousel = c; }}
renderItem={ <TouchableHighlight onPress={() => navigate("Products", { product: item })} underlayColor="transparent">
<View style={styles.view} >
<Image style={styles.image} source={{uri: item.images[0].src}} />
<Text style={styles.text}>{item.name}</Text>
<View style={styles.borderNow}></View>
<View style={styles.cartPrice}>
<Text style={styles.addCart}>₹{item.price}</Text>
<Text style={styles.price}>
</Text>
</View>
</View>
</TouchableHighlight>
}
sliderWidth={290}
itemWidth={290}
/>
} />
return (
<View>
{carr}
</View>
I used 'react-native-snap-carousel' this module and tried for sliding. But I get evaluating.data.length error . I am beginner in react.

Resources